HTML制作简易滚动图练习

<div id=demo style="OVERFLOW: hidden; width: 600px; height: 500px; top:10px; left:90px;position: absolute;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" id=demo1>
<!-- 要循环滚动的图片 -->
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" >
<tr>
<td width="200" align="center" style="height: 151px">
<img src="001.jpg" width="194" height="147" border="0" /></a>
</td>
<td width="200" align="center" style="height: 151px">
<img src="002.jpeg" width="194" height="147" border="0" /></a>
</td>
<td align="center" style="height: 151px; width: 200px;">
<img src="003.jpg" width="194" height="147" border="0" /></a>
</td>
</tr>
</table>
</td>
<td id=demo2 width=1></td>
</tr>
</table>
</div>


//js

<script>
    var speed=30//速度数值越大速度越慢
    var demo2 = document.getElementById("demo2");
    var demo = document.getElementById("demo");
    var demo1 = document.getElementById("demo1");

    demo2.innerHTML=demo1.innerHTML
    function Marquee(){
    if(demo2.offsetWidth-demo.scrollLeft<=0)
    demo.scrollLeft-=demo1.offsetWidth
    else{
    demo.scrollLeft++
        }
         }
    var wh=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(wh)}
    demo.onmouseout=function() {wh=setInterval(Marquee,speed)}
</script>