思路：
一組圖片控制它的滾動條進行滾動且此時對這組圖片進行複制並添加進原圖片組中，現在就有兩組圖片了。你可以想像一下，現在滾動條繼續滾動，原來那組圖片最後一張圖片已經滾至頂端且消失，複製的那組圖片的第一張跟在原圖最後一張圖片後出現，此時你就能感覺到無縫滾動了。
複製代碼代碼如下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS圖片向左滾動</title>
<style type="text/css">
img{
border: none;
}
</style>
</head>
<body>
<div id="demo" style="overflow:hidden;width:500px;">
<table border=0 align=center cellpadding=1 cellspacing=1 cellspace=0 >
<tr>
<td id="demo1" valign="top" bgcolor="ffffff">
<!-- 特別注意，下面的圖片總寬度必須大於上面定義的demo的寬度，如上面demo的寬度為500px,則下面圖片總寬度必須大於500,否則會出現些問題！ -->
<table cellspacing="0" cellpadding="0">
<tr align="center">
<td><a href="#" target="_blank"><img src="images/1.jpg"></a></td>
<td><a href="#" target="_blank"><img src="images/2.jpg"></a></td>
<td><a href="#" target="_blank"><img src="images/3.jpg"></a></td>
<td><a href="#" target="_blank"><img src="images/4.jpg"></a></td>
<td><a href="#" target="_blank"><img src="images/5.jpg"></a></td>
</tr>
</table>
</td>
<td id="demo2" valign="top">
</td>
</tr>
</table>
</div>
<div id="msg"></div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
//0:定速度
var speed = 30;
//1:獲取元素demo demo1 demo2
var demo = $("#demo");
var demo1 = $("#demo1");
var demo2 = $("#demo2");
//2:複製demo1-->demo2
var cont = $("#demo1").html();
$("#demo2").html(cont);
//3:創建方法定時執行
function hello(){
var left = $("#demo").scrollLeft();
if(left >= $("#demo1").width()){
left = 0;
}else{
left++;
}
$("#demo").scrollLeft(left);
setTimeout("hello()",speed);
}
hello();
// 移動demo.scrollLeft();
</script>
</body>
</html>