前端轮播图，无缝衔接

1.假设三张图片轮播，首先要把三张图放在一个div里，但只显示一张图
 <div class="window" style="width:1140px">  
       <div class="image_reel" style="width:4560px">  
           <a href="#"><img src="1.jpg" alt="" /></a>  
           <a href="#"><img src="2.jpg" alt="" /></a>  
           <a href="#"><img src="3.jpg" alt="" /></a>  
           <a href="#"><img src="1.jpg" alt="" /></a>  
       </div>  
   </div> 

.window{
height: 300px;
width: 1140px;
overflow: hidden;
position: relative;
}
.image_reel{
position: absolute;
top: 0;
left: 0px;
}
.image_reel img{
width: 1140px;
height: 300px;
float: left;
}

2.做定时器，定时移动position的left的位置
3.无缝衔接，在轮播到第三张时，不是直接把position的left定位到0px上，这样的话，会有突兀感，而是先动画移动到第四张的图1中，同时用回调函数把left定位到0px上
$(".image_reel").animate({
left:-image_reelPosition     //3*imgeWidth
},500,function(){
$(this).css({'left':'0px'});
});