灰儿 发表于 2007-10-28 07:26:54

JS无缝不间断图片左右滚动代码

代码如下:
<TABLE style="BORDER: #ccc 1px solid;" cellSpacing=0 cellPadding=0 width=750 align=center border=0>
<TBODY>
<TR>
    <TD>
      <DIV id=demo style="OVERFLOW: hidden; WIDTH: 100%; COLOR: #ffffff">
      <TABLE cellSpacing=0 cellPadding=0 align=left border=0 cellspace="0">
      <TBODY>
      <TR>
          <TD id=demo1 vAlign=top><table width="1710" height="116"border="0" cellpadding="0" cellspacing="0">
            <tr>
            <td width="171" background="images/pic_bg.jpg"><div align="center">1</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">
                <p>2</p>
                </div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">3</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">4</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">5</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">6</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">7</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">8</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">9</div></td>
            <td width="171" background="images/pic_bg.jpg"><div align="center">10</div></td>
            </tr>
          </table></TD>
          <TD id=demo2 vAlign=top>&nbsp;</TD></TR></TBODY></TABLE></DIV>
    </TD></TR></TBODY></TABLE></TD></TR></TABLE>

<SCRIPT>
var speed3=25 //速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed3)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed3)}
</SCRIPT>

备注:更改滚动方式,请修改相应未知的代码 倒数第7行

demo.scrollLeft++ 向左滚动
demo.scrollLeft-- 向右滚动
demo.scrolltop++ 向上滚动
demo.scrolltop-- 向下滚动
页: [1]
查看完整版本: JS无缝不间断图片左右滚动代码