`
流星剑
  • 浏览: 94296 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

图片横向无缝滚动

    博客分类:
  • js
阅读更多
<div id="demo" style="overflow:hidden;">
    <div id="indemo" style="float:left; width:800%">
     <div id="demo1" style="float:left;">
     <img src="img/一点绿.jpg" width="110" height="89" />
     <img src="img/中原一点红.jpg" width="110" height="89" />
     <img src="img/大炸鱼.jpg" width="110" height="89" />
     <img src="img/白菜鲜蘑.jpg" width="110" height="89" />
     <img src="img/米饭.jpg" width="110" height="89" />
     <img src="img/肉片.jpg" width="110" height="89" />
     <img src="img/蒜苔炒肉.jpg" width="110" height="89" />
     </div>
     <div id="demo2" style="float:left;"></div>
     </div></div> 
     <script type="text/javascript">
	 <!--
      var speed=10;
	  var tab=document.getElementById("demo");
	  var tab1=document.getElementById("demo1");
	  var tab2=document.getElementById("demo2");
   tab2.innerHTML=tab1.innerHTML;
    function Marquee()
	{
		if(tab2.offsetWidth-tab.scrollLeft<=0)
		tab.scrollLeft-=tab1.offsetWidth;
		else{
		tab.scrollLeft++;
		}
		}
		var MyMar=setInterval(Marquee,speed);
		tab.onmousemove=function(){clearInterval(MyMar)};
		tab.onmouseout=function(){MyMar=setInterval(Marquee,speed)};
		-->
     </script>

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics