JS实现图片从右向左滚动代码
代码简介:
JavaScript图片滚动,看了一下代码,好像这方法挺简便的,容易修改,滚动无空隙,循环连续滚动,鼠标放上后停止,中间部分代码使用了Table,不懂CSS的朋友也没关系,你可以继续开发,以满足你的需要。
代码内容:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<title>JS实现图片从右向左滚动代码 - www.webdm.cn</title>
<div id=demo style=overflow:hidden;height:180;width:600;color:#ffffff>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo1 valign=top>
<table border=0 cellpadding=0 cellspacing=0>
<tr>
<td>
<TABLE cellSpacing=0 cellPadding=5 border=0>
<TBODY>
<TR align=middle>
<TD>
<img src=http://www.webdm.cn/images/wall2_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall3_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall4_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall5_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall6_s.jpg>
</TD>
</TR></TBODY>
</TABLE>
</td></tr>
</table>
</td><td id=demo2 valign=top></td>
</tr>
</table>
</div>
<script>
var speed=30//数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
<br />
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码!</p>
代码来自:http://www.webdm.cn/webcode/668d71ec-063b-487f-8daa-881da0ec5a5d.html
<div id=demo style=overflow:hidden;height:180;width:600;color:#ffffff>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo1 valign=top>
<table border=0 cellpadding=0 cellspacing=0>
<tr>
<td>
<TABLE cellSpacing=0 cellPadding=5 border=0>
<TBODY>
<TR align=middle>
<TD>
<img src=http://www.webdm.cn/images/wall2_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall3_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall4_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall5_s.jpg>
</TD>
<TD>
<img src=http://www.webdm.cn/images/wall6_s.jpg>
</TD>
</TR></TBODY>
</TABLE>
</td></tr>
</table>
</td><td id=demo2 valign=top></td>
</tr>
</table>
</div>
<script>
var speed=30//数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
<br />
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码!</p>
代码来自:http://www.webdm.cn/webcode/668d71ec-063b-487f-8daa-881da0ec5a5d.html