js上下滚动代码
编辑器加载中...
<div id="div_babyhome" style="overflow: hidden; height: 253px; width: 100%;">
<div id="div_scorlltop1">
</div>
</div>
<div id="div_scorlltop2">
</div>
<script type="text/javascript">
var speed = 30;
var MyMar1 = null;
var MyMar2 = null;
var colee2 = document.getElementById("div_scorlltop2");
var colee1 = document.getElementById("div_scorlltop1");
var colee = document.getElementById("div_babyhome");
colee2.innerHTML = colee1.innerHTML; //克隆colee1为colee2
function Marquee1() {
//当滚动至colee1与colee2交界时
if (colee2.offsetTop - colee.scrollTop <= 0) {
clearInterval(MyMar1);
MyMar1 = null;
MyMar2 = setInterval(Marquee2, speed); //colee.scrollTop -= colee1.offsetHeight; //colee跳到最顶端
} else {
colee.scrollTop = colee.scrollTop + 1;
}
}
MyMar1 = setInterval(Marquee1, speed)//设置定时器
//鼠标移上时清除定时器达到滚动停止的目的
colee.onmouseover = function() {
if (MyMar1 != null)
clearInterval(MyMar1);
if (MyMar2 != null)
clearInterval(MyMar2);
}
//鼠标移开时重设定时器
colee.onmouseout = function() {
if (MyMar1 != null)
MyMar1 = setInterval(Marquee1, speed);
if (MyMar2 != null)
MyMar2 = setInterval(Marquee2, speed);
}
function Marquee2() {
if (colee2.offsetTop - colee.scrollTop >= 0) {
colee.scrollTop--;
if (colee.scrollTop == 0) {
clearInterval(MyMar2);
MyMar2 = null;
MyMar1 = setInterval(Marquee1, speed);
}
}
else {
colee.scrollTop += colee2.offsetHeight;
}
}
</script>