一:平滑滚动
<div class="prolist" id="prolistdiv" style="height:375px;overflow:hidden">
<ul id="prolist" >
...............
</ul>
</div>
overflow:hidden这句很关键
js
//div //方向 //每个单元宽 //速度 //运动频率
function objectMarqueeUD(object, direction, height, speed, lv, count) {
this.object = object;
this.ok = true;
if (lv) {
this.lv = lv;
} else {
this.lv = 1;
}
//this.table = object.getElementsByTagName("table")[0];
//var rows = this.table.rows;
//var tdcount = this.table.rows.length;
var tdcount = 30;
this.sample = 0;
for (var i = 0; i < tdcount; i++) {
this.sample += height;
}
if (this.sample > parseInt(this.object.style.height)) {
//克隆对象
for (var i = 0; i < count; i++) {
this.object.innerHTML += this.object.innerHTML;
}
var othis = this;
switch (direction) {
case "up":
othis.object.scrollTop = 0;
setInterval(function () {
if (othis.ok) {
othis.object.scrollTop = othis.object.scrollTop + othis.lv;
if (othis.object.scrollTop >= othis.sample) {
othis.object.scrollTop = 0;
}
}
}, speed);
break;
case "down":
var rightvalue = othis.sample * 2 - parseInt(othis.object.style.height);
othis.object.scrollTop = rightvalue;
setInterval(function () {
if (othis.ok) {
othis.object.scrollTop -= othis.lv;
if (othis.object.scrollTop <= (othis.sample - parseInt(othis.object.style.height))) {
othis.object.scrollTop = rightvalue;
}
}
}, speed);
break;
}
this.object.onmouseover = function () { othis.ok = false }; //鼠标移上时清除定时器达到滚动停止的目的
this.object.onmouseout = function () { othis.ok = true }; //鼠标移开时重设定时器
}
}
var oMarquee1 = new objectMarqueeUD(document.getElementById("prolistdiv"), "up", 200, 90, 1, 1);