如何实现图片的动态滚动

js<script type="text/javascript">
var speed=30;
marquee_product2.innerHTML=marquee_product1.innerHTML;
function Marquee(){
if(marquee_demo.scrollLeft>=marquee_product1.scrollWidth){
marquee_demo.scrollLeft=0;
}
else{
marquee_demo.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
marquee_demo.onmouseover=function(){clearInterval(MyMar);}
marquee_demo.onmouseout=function(){MyMar=setInterval(Marquee,speed);}
</script>

我做的是文字滚动，不过你可以把文字改成图片就行了。
<html>
<head>
<title>文字向上滚动</title>
<style type="text/css">
<!--
<STYLE type="text/css">
A{font-size:13px;
color:#000000;
/*无下划线的链接文字样式*/
text-decoration:none;
line-height:22px;}
A:hover{font-size:13px;
color:#FF0000;
/*无下划线的链接文字样式*/
text-decoration:underline;
line-height:22px;}</style>
</head><body>
<form name="form1" method="post" action="">
  <div id="div3" style="overflow:hidden;height:110px; width=245px;">
    <div id="div1" >
      <p><a href="#">发的卡死啦合法的刷卡了发挥的萨克范德萨</a></p>
      <p><a href="#">放大看沙发都是分开的实力辅导书</a></p>
      <p><a href="#">肌肤的身份回到拉萨妇女的开始就</a></p>
      <p><a href="#">后方可都是拉横幅iewfndskjafl</a></p>
      <p><a href="#">覅额ufhdjskfhdsuiafhdskafhdsk发嗲搜而分开的萨法维尔佛法 </a></p>
      <p><a href="#">发金额哦iwfdsfndsarewiofhdsf</a> </p>
    </div>
    <div id="div2"></div>
  </div>
</form>
<script language="javascript" type="text/javascript">
var speed=20;
div2.innerHTML=div1.innerHTML;
function up()
{
     if(div2.offsetTop-div3.scrollTop<=0)
{
     div3.scrollTop-=div1.offsetHeight;
}
else
{
     div3.scrollTop++;
}
}
var mar=setInterval(up,speed);
     div3.onmouseover=function(){clearInterval(mar)}
     div3.onmouseout=function(){mar=setInterval(up,speed)}
</script>
</body>
</html>

<div id=demo style="overflow:hidden;height:145px;width:100%;border:5px solid #F5F5F7;padding:2px;">
  <table align=left cellpadding="0" cellspacing="0" border=0>
  <tr><td id=demo1 valign=top>
     <table width="5%" height="135" border="0" align="left" cellpadding="3" cellspacing="3">
              <tr>


              </tr>
            </table>
         </td><td id=demo2 valign=top></td></tr></table></div>
<script language="javascript">  var speed=25
  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>
  </script>

调试易

如何实现图片的动态滚动

解决方案 »