符合W3C Web标准的图片连续无间隙水平滚动-技术开发JavaScript技术-Ubuntu系统_Ubuntu服务器

这次又遇上一个这样的问题，找了老半天终于从网上找到一个不错的，看了下代码，思路很简单，但代码太多，通用性也不行，于是乎，自己又发明了两个函数，用起来感觉还真不错，与大家共享：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>图片连续无间隙向左滚动，无间隙向右滚动，符合W3C Web标准_</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> </head> <body>  <table cellpadding="0" align="left" border="0" cellspace="0"> <tr> <td id="demo1" valign="top"><table cellspacing="0" cellpadding="0" width="322" bgcolor="#fffbf7" border="0"> <tr align="center"> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> </tr> </table></td> <td id="demo2" valign="top"></td> </tr> </table>   <table cellpadding="0" align="left" border="0" cellspace="0"> <tr> <td id="demo11" valign="top"><table cellspacing="0" cellpadding="0" width="322" bgcolor="#fffbf7" border="0"> <tr align="center"> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> <td width="50" height="50"><img height="50" src="http://www.jb51.<a href=/itjie/NETjishu/ target=_blank class=infotextkey>NET</a>/article/www.yonfa365.com.jpg" /> </td> </tr> </table></td> <td id="demo22" valign="top"></td> </tr> </table>   </body> </html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
以下为网上提供的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Document</title> </head> <body> <img src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/ab468f368478ff34bce1cbb7136c818b.gif" style="cursor:pointer" onmouseover="clearright();toleft()"/> <img src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/4cad782f9220cb6ce88d8eb52c77f205.gif"style="cursor:pointer" onmouseover="clearleft();toright()"/>   <table cellpadding="0" align="left" border="0" cellspace="0"> <tbody> <tr> <td id="demo1" valign="top"><table cellspacing="0" cellpadding="0" width="322" bgcolor="#fffbf7" border="0"> <tbody> <tr align="center"> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/b9b4713a1fe88284936539cccb6d96fb.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/ab64074d0d24be256dbdec3dc0a1f9b7.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/f2cc11c8ea34138f7deac0d5b7f02cd4.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/0339667911372b9de6e0904f43f99359.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/15b3759f1321ff1a9e37047406d5d32f.jpg" /> </td> </tr> </tbody> </table></td> <td id="demo2" valign="top"></td> </tr> </tbody> </table>     <table cellpadding="0" align="left" border="0" cellspace="0"> <tbody> <tr> <td id="demo_b" valign="top"><table cellspacing="0" cellpadding="0" width="322" bgcolor="#fffbf7" border="0"> <tbody> <tr align="center"> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/2dfc5ecb3a803dc475387cc3d0b8fca7.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/9af3e6e0874a9b29614f31ae7ce8c702.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/1c93cd1a49222f53735c72fcef9593c2.jpg" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/120f0bada5f115ba82ff162a60138d2f.gif" /> </td> <td width="50" height="50"><img height="50" src="/d/file/itjie/<a href=/itjie/Javajishu/ target=_blank class=infotextkey>Java</a>Scriptjishu/2014-10-23/b9b4713a1fe88284936539cccb6d96fb.jpg" /> </td> </tr> </tbody> </table></td> <td id="demo_c" valign="top"></td> </tr> </tbody> </table>   </body> </html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

JavaScript技术：符合W3C Web标准的图片连续无间隙水平滚动，转载需保留来源！

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。

相关文章阅读