两套滚动图片效果JS代码

 <!--第一个图片滚动开始-->
<table width="100%" border="0" cellspacing="1" cellpadding="0" >
  <tr>
    <td >
<div id="demo" style="overflow: hidden; width: 460px; height:100px" >
  <table cellpadding="0" align="left" border="0" cellspace="0">
    <tr>
      <td id="demo1" valign="top"><table cellspacing="0" cellpadding="0" width="460"  border="0">
        <tr align="center"><td>
<img src=/pinpai/10.gif><img src=/pinpai/10.gif><img src=/uploads/allimg/081002/0740130.gif>
</td>

      
        </tr>
      </table></td>
      <td id="demo2" valign="top"></td>
    </tr>
  </table>
</div>
<script type="text/javascript" language="JavaScript">
//调用向左滚动
toleft("demo","demo1","demo2",30,"hehe123")

function $(id){return document.getElementById(id)}
//向左滚动函数，demo包含demo1与demo2,speed是滚动速度，flag一个网页内有多个时设置为不同的任意字符。
function toleft(demo,demo1,demo2,speed,flag){
demo=$(demo);demo1=$(demo1);demo2=$(demo2)
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0){
demo.scrollLeft-=demo1.offsetWidth
}
else{
demo.scrollLeft++
}
}
flag=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(flag);}
demo.onmouseout=function(){flag=setInterval(Marquee,speed);}
}

</script>
</td>
  </tr>
</table>

<!--第一个图片滚动结束-->

<!--第二个图片滚动开始-->

<div id=demos style="overflow:hidden; width:128px; height:300px;">
<div id=demos1>
<img src="http://www.1loveqq.cn/logo.gif" width="85">
<img src="http://www.1loveqq.cn/logo.gif" width="85">
<img src="http://www.1loveqq.cn/logo.gif" width="85">
<img src="http://www.1loveqq.cn/logo.gif" width="85">
<img src="http://www.scku8.cn/logo.gif" width="85">
<img src="http://www.scku8.cn/logo.gif" width="85">
<img src="http://www.scku8.cn/logo.gif" width="85">
<img src="http://www.scku8.cn/logo.gif" width="85">
</div>
<div id=demos2></div>
</div>
<script language="javascript">
var speed=30
demos2.innerHTML=demos1.innerHTML
function Marquee(){
if(demos2.offsetTop-demos.scrollTop<=0)
demos.scrollTop-=demos1.offsetHeight
else{
demos.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demos.onmouseover=function() {clearInterval(MyMar)}
demos.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>

<!--第二个图片滚动结束-->

建立个JS文件 调用JS的方法 我也不多说了  调用数据图片的方法 是我之前发表的欢灯片的方法是一样的

评论总数：1 条 [ 查看全部 ] 网友评论