您当前的位置: 首页 » JavaScript/JQuery编程 » 学习技巧：JS不间断向下滚动
学习技巧：JS不间断向下滚动
论坛链接
<div id=demo style=overflow:hidden;height:300;width:500;background:#f4f4f4;color:#ffffff><div id=demo1>
<img src="http://www.geekg.com/files/images8/20070722233532H.jpg">
<img src="http://www.geekg.com/files/images6/20070718000229n.jpg">
<img src="http://www.geekg.com/files/images8/20070724004138e.jpg">
<img src="http://www.geekg.com/files/images8/200707240019131.jpg">
<img src="http://www.geekg.com/files/images8/20070722234005h.jpg">
</div>
<div id=demo2></div>
</div>
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollTop=demo.scrollHeight
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
<img src="http://www.geekg.com/files/images8/20070722233532H.jpg">
<img src="http://www.geekg.com/files/images6/20070718000229n.jpg">
<img src="http://www.geekg.com/files/images8/20070724004138e.jpg">
<img src="http://www.geekg.com/files/images8/200707240019131.jpg">
<img src="http://www.geekg.com/files/images8/20070722234005h.jpg">
</div>
<div id=demo2></div>
</div>
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollTop=demo.scrollHeight
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>