admin管理员组

文章数量:1794759

使用HTML实现网页滚动图片

使用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|/数据库/HTML style="color:#2aa0ea" target=_blank class=infotextkey>网页制作/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>

结果如下:

 

本文标签: 网页图片html