开启企业建站营销新时代、免费建站平台倡导者  站长学院  高端定制请点这里
热线:13913253836
您现在的位置:首页 > 站长学院 > 建站资讯 > 建站、设计教程 > 幻灯片和轮播图

js 图片向左滚动效果代码

作者:eycms 日期:2016/2/16 16:38:48 人气:40

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>js 图片向左滚动效果代码</title>

<style>

img{

border:#000 1px solid;

}

</style>

</HEAD>

<BODY>

<table width="750"  border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">

  <tr>

    <td><DIV id=demo style="OVERFLOW: hidden; WIDTH: 744px; COLOR: #ffffff">

      <TABLE cellSpacing=0 cellPadding=0 align=center border=0 cellspace="0">

        <TBODY>

          <TR>

            <TD id=demo1 vAlign=top><table width="100%"  border="0" cellpadding="2" cellspacing="2">

                <tr>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" ></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                  <td><a href="http://www.xx.cn.net"><img src="http://www.1xcn.net/images/home/logo.gif" alt="网"></a></td>

                </tr>

            </table></TD>

            <TD id=demo2 vAlign=top></TD>

          </TR>

        </TBODY>

      </TABLE>

    </DIV>

      

    </td>

  </tr>

                      <TD width="750" vAlign=top>

<SCRIPT>

var speed3=18//速度数值越大速度越慢

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></td>

                      </tr>

</table>

<table width="750"  border="0" align="center" cellpadding="0" cellspacing="0">

  <tr> 

  </tr>

</table>

<TABLE cellSpacing=0 cellPadding=0 align=center border=0>

  <TBODY></TBODY></TABLE>

<TABLE cellSpacing=0 cellPadding=0 align=center border=0>

<TBODY></TBODY></TABLE>

</BODY></HTML>


回到顶部