JS不间断向左滚动-漂浮滚动-点滴吧

www.diandiba.com

记录点点滴滴，尽在点滴吧

文章

您现在的位置：首页 > 漂浮滚动 > 特效详情

JS不间断向左滚动

更新时间：2015/3/19 9:05:19 下载：3178次

<div id="demo" style="overflow:hidden;height:139px;width:400px;background:#f4f4f4;color:#ffffff;"><table align="left" cellpadding="0" cellspace="0" border="0"><tr><td id="demo1" valign="top"><img src="http://www.diandiba.com/Upload/14217362159414671.jpg" height="139" width="180" style="margin-right:5px;"><img src="http://www.diandiba.com/Upload/14217362159414671.jpg" height="139" width="180" style="margin-right:5px;"><img src="http://www.diandiba.com/Upload/14217362159414671.jpg" height="139" width="180" style="margin-right:5px;"><img src="http://www.diandiba.com/Upload/14217362159414671.jpg" height="139" width="180" style="margin-right:5px;"><img src="http://www.diandiba.com/Upload/14217362159414671.jpg" height="139" width="180" style="margin-right:5px;"></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>

预览效果复制代码保存代码提示：可以先修改部分代码后再运行

注意：图片之间不要使用空格，否则无法滚动。

上一个素材：js新浪微博大厅滚动效果 下一个素材：符合标准的随滚动条滚动代码