首先要实现图片轮播，就要设置一个包含它的div，然后我们把图片放在一个表格中，这样比较好看。body里边基本就放这几样东西，很简单。
<body> <div id="datu"> <table cellpadding="0" cellspacing="0" id="aa"> <tr height="500"> <td><img src="1.jpg" width="1360" height="500px"/></td> <td><img src="2.jpg" width="1360" height="500px" /></td> <td><img src="3.jpg" width="1360" height="500px" /></td> <td><img src="4.jpg" width="1360" height="500px" /></td> <td><img src="5.jpg" width="1360" height="500px" /></td> </tr> </table> </div> </body>
接下来就是用CSS样式表对body里面的内容规定样式。
<style> *{ margin:0px; padding:0px;} #datu { 1360px; height:500px; border: 1px solid #000; overflow:hidden; position:relative; } #aa{ position:relative; top:0px; left:0px; transition:0.5s;} </style>
最后也最关键的就是图片自动播放的js方法，其实就是摘取各个ID给它们赋值，setTimeout( ) 是属于 window 的 method, 但我们都是略去 window 这顶层物件名称, 这是用来设定一个时间, 时间到了, 就会执行一个指定的 method。
<script> document.getElementById("aa").style.left="0px"; function shao() { var aa = parseInt(document.getElementById("aa").style.left); if(aa>-5400) { document.getElementById("aa").style.left=(aa-1360)+"px" } else { document.getElementById("aa").style.left="0px" }bb = window.setTimeout("shao()",1000); }bb = window.setTimeout("shao()",1000); </script>