js 无缝滚动只滚动一次

JavaScript013

js 无缝滚动只滚动一次,第1张

应该是图片高度或宽度不够，不知道你是左右滚动还是上下滚动。你多放几张图片，这个原理是必须图片加在一起的高度或宽度（看上下滚动还是左右滚动而定）必须大于div的高度或者宽度，他就能连续不断的滚动了

<div id="demo" style="overflow:hiddenheight:500pxwidth:120pxborder:1px solid #dde5bcoverflow:hiddenfloat:left">

<div id=demo1>

<img src="images/js01.gif" width="120" height="120">

<img src="images/js02.gif" width="120" height="120">

<img src="images/js03.gif" width="120" height="120">

<img src="images/js04.gif" width="120" height="120">

<img src="images/js05.gif" width="120" height="120">

<img src="images/js06.gif" width="120" height="120">

<img src="images/js07.gif" width="120" height="120">

<img src="images/js08.gif" width="120" height="120">

<img src="images/js09.gif" width="120" height="120">

</div>

<div id=demo2></div>

</div>

<script>

var speed=40

var demo=document.getElementById("demo")

var demo2=document.getElementById("demo2")

var demo1=document.getElementById("demo1")

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>