<div class="box">        <div style="width: 1000px;" id="boxdiv"><ul><li style="display: block;" title="晚霞中的民航飞机"><a href="#"><img src="http://5.26923.com/download/pic/000/337/f2418c0850058ff9edb2bb85e30be1cb.jpg" /></a></li><li title="波音787"><a href="#"><img src="http://5.26923.com/download/pic/000/337/8d96f0fc8a9f2f9e5af628ec4b9ef64e.jpg" /></a></li><li title="一起去旅行"><a href="#"><img src="http://5.26923.com/download/pic/000/338/14533ca737e6b63c0abe3ee4dc22b6a4.jpg" /></a></li>             </ul></div></div>

.box{width: 800px;height: 200px;margin-top: 100px;margin-left: 100px;overflow: hidden;}.box img{border-style: none;height: 200px;}.box ul{margin: 0px;padding: 0px;list-style-type: none;}.box ul li{float: left;}

<script type="text/javascript">$(document).ready(function () {new ZouMa().Start();});function ZouMa() {this.maxLength = 3; //最低显示数           this.Timer = 2000;//计时器间隔时间this.Ul = $(".box ul");var handId;//计时器idvar self = this;this.Start = function () {if (self.Ul.children().length < this.maxLength) {self.Ul.append(self.Ul.children().clone());}handId = setInterval(self.Play, self.Timer);}this.Play = function () {var img = self.Ul.children().eq(0);var left = img.children().eq(0).width();img.animate({ "marginLeft": (-1 * left) + "px" }, 600, function () {//appendTo函数是实现走马灯一直不间断播放的秘诀。//目前网上看到的很多走马灯，走到最后一张的时候，会立马闪回第一张，而不是继续从后往前推进，即是没有明白该函数的作用的原因$(this).css("margin-left", "auto").appendTo(self.Ul);});}}</script>