使用HTML实现网页滚动图片

代码如下：

<div id="colee_left" style="overflow: hidden; width: 1920px;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="colee_left1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><p>&nbsp;</p></td>
<td><p>&nbsp;</p></td>
<td><p><img src="file:///D|/数据库/网页制作/20151226110506_GQ8Ey.jpeg.jpg（此处需要更改为自己电脑上的图片路径）" width="1920" height="1080"></p></td>
<td><p><img src="file:///D|/数据库/网页制作/ab2d059a914187fa45990a889888945b.jpg（此处需要更改为自己电脑上的图片路径）" width="1920" height="1080"></p></td>
<td><p><img src="file:///D|/数据库/网页制作/016534593b5ad7a8012193a3be0388.jpg（此处需要更改为自己电脑上的图片路径）" width="1920" height="1080"></p></td>
<td><p><img src="file:///D|/数据库/网页制作/6b0ff6dbcaca75d91fd430e862d843c7.jpg（此处需要更改为自己电脑上的图片路径）" width="1920" height="1080"></p></td>
</tr>
</table>
</td>
<td id="colee_left2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=1
var colee_left2=document.getElementById("colee_left2");
var colee_left1=document.getElementById("colee_left1");
var colee_left=document.getElementById("colee_left");
colee_left2.innerHTML=colee_left1.innerHTML
function Marquee3(){
if(colee_left2.offsetWidth-colee_left.scrollLeft<=0)
colee_left.scrollLeft-=colee_left1.offsetWidth
else{
colee_left.scrollLeft++
}
}
var MyMar3=setInterval(Marquee3,speed)
colee_left.onmouseover=function() {clearInterval(MyMar3)}
colee_left.onmouseout=function() {MyMar3=setInterval(Marquee3,speed)}
</script>

结果如下：