您当前的位置: 首页 » JavaScript/JQuery编程 » 学习技巧：JS不间断向上滚动教程
学习技巧：JS不间断向上滚动教程
论坛链接
<div id=demo style=overflow:hidden;height:300;width:600;background:#f4f4f4;color:#ffffff><div id=demo1>
<img src="http://www.geekg.com/files/images4/4ac549b487174c2187890ef219f7b5d1.jpg">
<img src="http://www.geekg.com/files/images3/9cab1a35cedd92bc813e9eb0723e7ba7.jpg">
<img src="http://www.geekg.com/files/images8/20070722014853U.jpg">
<img src="http://www.geekg.com/files/images6/fa68db6b781d648952b8e8b5d1bef9d4.jpg">
<img src="http://www.geekg.com/files/images5/043c230adf9e2123e03c680d89bf426c.jpg">
</div>
<div id=demo2></div>
</div>
<script>
var speed=50
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.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/images4/4ac549b487174c2187890ef219f7b5d1.jpg">
<img src="http://www.geekg.com/files/images3/9cab1a35cedd92bc813e9eb0723e7ba7.jpg">
<img src="http://www.geekg.com/files/images8/20070722014853U.jpg">
<img src="http://www.geekg.com/files/images6/fa68db6b781d648952b8e8b5d1bef9d4.jpg">
<img src="http://www.geekg.com/files/images5/043c230adf9e2123e03c680d89bf426c.jpg">
</div>
<div id=demo2></div>
</div>
<script>
var speed=50
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>