<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<머리>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<제목></제목>
</head>
<본문>
<스크립트 유형="텍스트/자바스크립트">
var $ = 함수(id) {
return "string" == ID 유형 ? document.getElementById(id) : id;
};
var 클래스 = {
생성: 함수() {
반환 함수() {
this.initialize.apply(this, 인수);
}
}
}
Object.extend = function(대상, 소스) {
for(소스의 var PRperty) {
목적지[속성] = 소스[속성];
}
귀국 목적지;
}
함수 addEventHandler(oTarget, sEventType, fnHandler) {
if (oTarget.addEventListener) {
oTarget.addEventListener(sEventType, fnHandler, false);
} else if (oTarget.attachEvent) {
oTarget.attachEvent("on" + sEventType, fnHandler);
} 또 다른 {
oTarget["on" + sEventType] = fnHandler;
}
};
var Scroller = Class.create();
Scroller.prototype = {
초기화: function(idScroller, idScrollMid, 옵션) {
var oScroll = this, oScroller = $(idScroller), oScrollMid = $(idScrollMid);
this.heightScroller = oScroller.offsetHeight;
this.heightList = oScrollMid.offsetHeight;
if(this.heightList <= this.heightScroller) return;
oScroller.style.overflow = "숨김";
oScrollMid.appendChild(oScrollMid.cloneNode(true));
this.oScroller = oScroller;
this.timer = null;
this.SetOptions(옵션);
this.side = 1;//1상 -1하하
스위치(this.options.Side) {
케이스 "다운":
this.side = -1;
부서지다;
"위로":
기본 :
this.side = 1;
}
addEventHandler(oScrollMid , "mouSEOver", function() { oScroll.Stop(); });
addEventHandler(oScrollMid , "mouseout", function() { oScroll.Start(); });
if(this.options.PauseStep <= 0 || this.options.PauseHeight <= 0) this.options.PauseStep = this.options.PauseHeight = 0;
this.Pause = 0;
this.Start();
},
//设置默认属性
SetOptions: 함수(옵션) {
this.options = {//默认值
단계: 1,//每次变化적 pxweight
시간: 20,//速島(越大越慢)
Side: "위",//滚动方向:"위"是上，"아래"是下
PauseHeight: 0,//더욱 高停一次
PauseStep: 1000//停顿时间(PauseHeight大于0该参数才有效)
};
Object.extend(this.options, 옵션 || {});
},
//滚动
스크롤: function() {
var iScroll = this.oScroller.scrollTop, iHeight = this.heightList, time = this.options.Time, oScroll = this, iStep = this.options.Step * this.side;
if(this.side > 0){
if(iScroll >= (iHeight * 2 - this.heightScroller)){ iScroll -= iHeight; }
} 또 다른 {
if(iScroll <= 0){ iScroll += iHeight; }
}
if(this.options.PauseHeight > 0){
if(this.Pause >= this.options.PauseHeight){
시간 = this.options.PauseStep;
this.Pause = 0;
} 또 다른 {
this.Pause += Math.abs(iStep);
this.oScroller.scrollTop = iScroll + iStep;
}
} else { this.oScroller.scrollTop = iScroll + iStep; }
this.timer = window.setTimeout(function(){ oScroll.Scroll(); }, time);
},
//开始
시작: 함수() {
this.스크롤();
},
//停止
중지: 함수() {
ClearTimeout(this.timer);
}
};
window.onload = 함수(){
new Scroller("idScroller", "idScrollMid",{ PauseHeight:25 });
}
</script>
<스타일>
#idScroller *{margin:0px; 패딩:0px;}
#idScroller{줄 높이:25px;너비:100%; 높이:25px; 오버플로:숨김; 테두리:1px 솔리드 #000000;}
#idScroller ul{너비:100%}
#idScroller li{너비:20%; 부동:왼쪽; 오버플로:숨김; 목록 스타일:없음;}
</style>
<div id="idScroller">
<div id="idScrollMid">
<ul>
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
<li> <a href=" http://www.devdao.com/">www.devdao.com</a></li >
</ul>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>