javascript上下左右定时滚动插件

2022-10-18,,,,

核心代码:
复制代码 代码如下:
<script type="text/javascript">
function marquee() {
this.id = document.getelementbyid(arguments[0]);
this.direction = arguments[1];
this.step = arguments[2];
this.width = arguments[3];
this.height = arguments[4];
this.timer = arguments[5];
this.waittime = arguments[6];
this.stoptime = arguments[7];
if (arguments[8]) { this.scrollstep = arguments[8]; } else { this.scrollstep = this.direction > 1 ? this.width : this.height; }
this.ctl = this.startid = this.stop = this.mouseover = 0;
this.id.style.overflowx = this.id.style.overflowy = "hidden";
this.id.nowrap = true;
this.id.style.width = this.width;
this.id.style.height = this.height;
this.clientscroll = this.direction > 1 ? this.id.scrollwidth : this.id.scrollheight;
this.id.innerhtml += this.id.innerhtml;
this.start(this, this.timer, this.waittime, this.stoptime);
}
marquee.prototype.start = function(msobj, timer, waittime, stoptime) {
msobj.startid = function() { msobj.scroll(); }
msobj.continue = function() {
if (msobj.mouseover == 1) { settimeout(msobj.continue, waittime); }
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, waittime); }
msobj.begin = function() {
msobj.timerid = setinterval(msobj.startid, timer);
msobj.id.onmouseover = function() { msobj.mouseover = 1; clearinterval(msobj.timerid); }
msobj.id.onmouseout = function() { msobj.mouseover = 0; if (msobj.stop == 0) { clearinterval(msobj.timerid); msobj.timerid = setinterval(msobj.startid, timer); } }
}
settimeout(msobj.begin, stoptime);
}
marquee.prototype.scroll = function() {
switch (this.direction) {
case 0:
this.ctl += this.step;
if (this.ctl >= this.scrollstep && this.waittime > 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.waittime > 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.waittime > 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.waittime > 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;
}
}
</script>

控制使用代码:
复制代码 代码如下:
<script type="text/javascript">
<!--
window.onload = function() {
new marquee(
"s1", //容器id
0, //向上滚动(0向上 1向下 2向左 3向右)
2, //滚动的步长
251, //容器可视宽度
520, //容器可视高度
50, //定时器 数值越小,滚动的速度越快(1000=1秒,建议不小于20)
2000, //间歇停顿时间(0为不停顿,1000=1秒)
3000, //开始时的等待时间(0为不等待,1000=1秒)
75 //间歇滚动间距(可选),可理解为行高,我这里是3*25=75,就是每次滚动三行
);
};
-->
</script>

效果演示:

[ctrl+a 全选 注:如需引入外部js需刷新才能执行]

《javascript上下左右定时滚动插件.doc》

下载本文的Word格式文档,以方便收藏与打印。