符合W3C Web标准的图片连续无间隙水平滚动

很久以前就有这个问题，总是找不到通用的，或比较简单的“图片连续无间隙向左滚动，无间隙向右滚动，符合W3C Web标准”

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

<!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> <div id="demo" style="overflow: hidden; width: 322px; height: 61px"> <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"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td></tr></table></td><td id="demo2" valign="top"></td></tr></table></div><div id="demo0" style="overflow: hidden; width: 322px; height: 61px"> <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"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td></tr></table></td><td id="demo22" valign="top"></td></tr></table></div></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> <div> <div id="demo" style="OVERFLOW: hidden; WIDTH: 322px; HEIGHT: 61px"> <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"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td></tr></tbody></table></td><td id="demo2" valign="top"></td></tr></tbody></table></div></div><div> <div id="demo_a" style="OVERFLOW: hidden; WIDTH: 322px; HEIGHT: 61px"> <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"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td><td width="50" height="50"></td></tr></tbody></table></td><td id="demo_c" valign="top"></td></tr></tbody></table></div></div></body></html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

以上就是符合W3C Web标准的图片连续无间隙水平滚动的详细内容，更多请关注0133技术站其它相关文章！