// javascript document /****************************************************************** * 通用不间断滚动js封装类 * 深蓝蝴蝶 * 使用方法 * new marquee("marquee",0,1,760,52,50,5000,3000) * new marquee("marquee",0,1,760,104,50,5000,3000,52) * * 参数说明: * 参数1 marquee 容器id * 参数2 0 向上滚动(0-向上 1-向下 2-向左 3-向右) * 参数3 1 滚动的步长(数值越大,滚动越快) * 参数4 760 容器可视宽度 * 参数5 52 容器可视高度 * 参数6 50 定时器(数值越小,滚动的速度越快 1000=1秒,建议不小于20) * 参数7 5000 间歇停顿延迟时间(0为不停顿,1000=1秒) * 参数8 3000 开始时的等待时间(0为不等待,1000=1秒) * 参数9 (52) 间歇滚动间距(可选,该数值与延迟均为0则为鼠标悬停控制) *  使用建议: * 1、建议直接赋予容器的显示区域的宽度和高度, * 如(
......
) * 2、建议为容器添加样式overflow=auto, * 如(
......
) * 3、为了更准确的获取滚动区域的宽度和高度,请尽可能将各滚动单位直接赋予正确宽高度 * 4、对于table标记的横向滚动,需要对table添加样式display=inline, * 如(
......
) * 5、对于翻屏滚动或间歇滚动,要注意各滚动单位间的间距, * 同时需要对容器的可视高度和可视宽度做好准确的设置,对于各滚动单位间的间距可以通过设置行间距或者单元格的高宽度来进行调整 * 6、对于li自动换行的问题暂时没有更好的解决办法,建议将其转换成表格(table)的形式来达到同等的效果 * * 注意:仅用div的时候需要用来包括div *******************************************************************/ var marquee=function(){this.id=document.getelementbyid(arguments[0]);this.direction=arguments[1];this.step=arguments[2];this.bakstep=arguments[2];this.width=arguments[3];this.halfwidth=math.round(arguments[3]/2);this.height=arguments[4];this.timer=arguments[5];this.delaytime=arguments[6];this.waittime=arguments[7];if(arguments[8] || arguments[8]==0){this.scrollstep=arguments[8];}else{this.scrollstep=this.direction>1?this.width:this.height;}this.correct=0;this.ctl=0;this.startid=0;this.stop=0;this.mouseover=0;this.id.style.overflow="hidden";this.id.style.overflowx="hidden";this.id.style.overflowy="hidden";this.id.nowrap=true;this.id.style.width=this.width+"px";this.id.style.height=this.height+"px";this.clientscroll=this.direction>1?parseint(this.id.scrollwidth):parseint(this.id.scrollheight);this.id.innerhtml+=this.id.innerhtml;this.isnotopera=(navigator.useragent.tolowercase().indexof("opera")==-1);if(arguments.length>=8){this.start(this,this.timer,this.delaytime,this.waittime);}} marquee.prototype.start=function(msobj,timer,delaytime,waittime){ msobj.startid=function(){msobj.scroll();}; msobj.continue=function(){if(msobj.mouseover==1){settimeout(msobj.continue,delaytime);}else{clearinterval(msobj.timerid);msobj.ctl=0;msobj.stop=0;msobj.timerid=setinterval(msobj.startid,timer);}}; msobj.pause=function(){msobj.stop=1;clearinterval(msobj.timerid);settimeout(msobj.continue,delaytime);}; msobj.begin=function(){ msobj.id.onmousemove=function(evt){if(msobj.scrollstep==0 && msobj.direction>1){var event=null;if(window.event){event=window.event;if(msobj.isnotopera){msobj.eventleft=event.srcelement.id==msobj.id.id?parseint(event.offsetx)-parseint(msobj.id.scrollleft):parseint(event.srcelement.offsetleft)-parseint(msobj.id.scrollleft)+parseint(event.offsetx);}else{msobj.scrollstep=null;return;}}else{event=evt;msobj.eventleft=parseint(event.layerx)-parseint(msobj.id.scrollleft);}msobj.direction=msobj.eventleft>msobj.halfwidth?3:2;msobj.abscenter=math.abs(msobj.halfwidth-msobj.eventleft);msobj.step=math.round(msobj.abscenter*(msobj.bakstep*2)/msobj.halfwidth);}}; msobj.id.onmouseover=function(){if(msobj.scrollstep==0){return;}msobj.mouseover=1;clearinterval(msobj.timerid);}; msobj.id.onmouseout=function(){if(msobj.scrollstep==0){if(msobj.step==0){msobj.step=1;}return;}msobj.mouseover=0;if(msobj.stop==0){clearinterval(msobj.timerid);msobj.timerid=setinterval(msobj.startid,timer);}};msobj.timerid=setinterval(msobj.startid,timer);};settimeout(msobj.begin,waittime);} marquee.prototype.scroll=function(){if(this.correct==0 && this.ctl>this.clientscroll){this.clientscroll=(this.direction>1)?math.round(parseint(this.id.scrollwidth)/2):math.round(parseint(this.id.scrollheight)/2);this.correct=1;}switch(this.direction){case 0:{this.ctl+=this.step;if(this.ctl>=this.scrollstep && this.delaytime>0){this.id.scrolltop+=(this.scrollstep+this.step-this.ctl);this.pause();return;}else{if(this.id.scrolltop>=this.clientscroll){this.id.scrolltop-=this.clientscroll;}this.id.scrolltop+=this.step;}break;}case 1:{this.ctl+=this.step;if(this.ctl>=this.scrollstep && this.delaytime>0){this.id.scrolltop-=(this.scrollstep+this.step-this.ctl);this.pause();return;}else{if(this.id.scrolltop<=0){this.id.scrolltop+=this.clientscroll;}this.id.scrolltop-=this.step;}break;}case 2:{this.ctl+=this.step;if(this.ctl>=this.scrollstep && this.delaytime>0){this.id.scrollleft+=(this.scrollstep+this.step-this.ctl);this.pause();return;}else{if(this.id.scrollleft>=this.clientscroll){this.id.scrollleft-=this.clientscroll;}this.id.scrollleft+=this.step;}break;}case 3:{this.ctl+=this.step;if(this.ctl>=this.scrollstep && this.delaytime>0){this.id.scrollleft-=(this.scrollstep+this.step-this.ctl);this.pause();return;}else{if(this.id.scrollleft<=0){this.id.scrollleft+=this.clientscroll;}this.id.scrollleft-=this.step;}break;}this.id.scrolltop+="px";this.id.scrollleft+="px";}}