/*msclass (class of marquee scroll通用不间断滚动js封装类) ver 1.4*\
应用说明:页面包含该类
创建实例:new marquee("marquee",0,1,760,52,50,5000,3000)
new marquee("marquee",0,1,760,104,50,5000,3000,52)
参数说明:marquee 容器id
0 向上滚动(0向上 1向下 2向左 3向右)
1 滚动的步长(数值越大,滚动越快)
760 容器可视宽度
52 容器可视高度
50 定时器(数值越小,滚动的速度越快 1000=1秒,建议不小于20)
5000 间歇停顿延迟时间(0为不停顿,1000=1秒)
3000 开始时的等待时间(0为不等待,1000=1秒)
(52) 间歇滚动间距(可选,该数值与延迟均为0则为鼠标悬停控制)
使用建议:
1、建议直接赋予容器的显示区域的宽度和高度,如(
......
)
2、建议为容器添加样式overflow = auto,如(......
)
3、为了更准确的获取滚动区域的宽度和高度,请尽可能将各滚动单位直接赋予正确宽高度
4、对于table标记的横向滚动,需要对table添加样式display = inline,如()
5、对于翻屏滚动或间歇滚动,要注意各滚动单位间的间距,同时需要对容器的可视高度和可视宽度做好准确的设置,对于各滚动单位间的间距可以通过设置行间距或者单元格的高宽度来进行调整
6、对于li自动换行的问题暂时没有更好的解决办法,建议将其转换成表格(table)的形式来达到同等的效果
*/
function marqscroll()
{
this.id = document.getelementbyid(arguments[0]);
this.direction = arguments[1];
this.step = 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 = this.ctl = this.startid = this.stop = this.mouseover = 0;
this.id.style.overflow = this.id.style.overflowx = this.id.style.overflowy = "hidden";
this.id.nowrap = true;
this.id.style.width = "100%"; //this.width + "px";
if(document.getelementbyid("hidlayouttag").value=='2'){
this.id.style.height = "100%";
}else{
this.id.style.height = this.height + "px";
}
this.clientscroll = this.direction > 1 ? this.id.scrollwidth : 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);
}
marqscroll.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 = 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(event)
{
if(msobj.scrollstep == 0 && msobj.direction > 1)
{
var event = event || window.event;
if(window.event)
{
if(msobj.isnotopera)
{
msobj.eventleft = event.srcelement.id == msobj.id.id ? event.offsetx - msobj.id.scrollleft : event.srcelement.offsetleft - msobj.id.scrollleft + event.offsetx;
}
else
{
msobj.scrollstep = null;
return;
}
}
else
{
msobj.eventleft = event.layerx - 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);
}
marqscroll.prototype.scroll = function()
{
if(this.correct == 0 && this.ctl > this.clientscroll)
{
this.clientscroll = this.direction > 1 ? math.round(this.id.scrollwidth / 2) : math.round(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;
}
}