javascriot 图片无缝左右滚动效果
<head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>向上下左右不间断无缝滚动图片的效果(兼容火狐和IE)</title> </head> <body><!--下面是向上滚动代码--> <!--下面是向右滚动代码--> <a href="javascript:left();">左</a><div id="left"><div id="jsweb8_cn_right" style="overflow:hidden;width:500px;display:none;"> <table cellpadding="0" cellspacing="0" border="0"> <tr><td id="jsweb8_cn_right1" valign="top" align="center"> <table cellpadding="2" cellspacing="0" border="0"> <tr align="center"> <td><img src="1.jpg"></td> <td><img src="2.jpg"></td> <td><img src="3.jpg"></td> <td><img src="4.jpg"></td> <td><img src="5.jpg"></td> </tr> </table> </td> <td id="jsweb8_cn_right2" valign="top"></td> </tr> </table> </div><!--下面是向左滚动代码--> <div id="jsweb8_cn_left" style="overflow:hidden;width:500px;"> <table cellpadding="0" cellspacing="0" border="0"> <tr><td id="jsweb8_cn_left1" valign="top" align="center"> <table cellpadding="2" cellspacing="0" border="0"> <tr align="center"> <td><img src="1.jpg"></td> <td><img src="2.jpg"></td> <td><img src="3.jpg"></td> <td><img src="4.jpg"></td> <td><img src="5.jpg"></td><td><img src="7.jpg" width="88"></td> <td><img src="6.jpg"></td> </tr> </table> </td> <td id="jsweb8_cn_left2" valign="top"></td> </tr> </table> </div> </div><a href="javascript:right();">右</a><script> var speed=30//速度数值越大速度越慢 jsweb8_cn_right2.innerHTML=jsweb8_cn_right1.innerHTML function Marquee4(){ if(jsweb8_cn_right.scrollLeft<=0) jsweb8_cn_right.scrollLeft+=jsweb8_cn_right2.offsetWidth else{ jsweb8_cn_right.scrollLeft-- } } var MyMar4=setInterval(Marquee4,speed) jsweb8_cn_right.onmouseover=function() {clearInterval(MyMar4)} jsweb8_cn_right.onmouseout=function() {MyMar4=setInterval(Marquee4,speed)}////jsweb8_cn_left2.innerHTML=jsweb8_cn_left1.innerHTML function Marquee3(){ if(jsweb8_cn_left2.offsetWidth-jsweb8_cn_left.scrollLeft<=0) jsweb8_cn_left.scrollLeft-=jsweb8_cn_left1.offsetWidth else{ jsweb8_cn_left.scrollLeft++ } } var MyMar3=setInterval(Marquee3,speed) jsweb8_cn_left.onmouseover=function() {clearInterval(MyMar3)} jsweb8_cn_left.onmouseout=function() {MyMar3=setInterval(Marquee3,speed)} function left(){ if(document.getElementById('jsweb8_cn_left').style.display=='none'){document.getElementById('jsweb8_cn_right').style.display='none';document.getElementById('jsweb8_cn_left').style.display='block'}}function right(){ if(document.getElementById('jsweb8_cn_right').style.display=='none'){document.getElementById('jsweb8_cn_left').style.display='none';document.getElementById('jsweb8_cn_right').style.display='block';}}</script> <!--向右滚动代码结束--> </body> </html> ?