JQuery自动循环轮播

实现循环轮播 最重要的是 在第一轮播完之后，如何重头开始播放

//原始HTML

  

  

  



//li后面加上一个01的图片

  

  

  

  

从03>>动画到01,然后在直接订到真正的01

实例：

$(document).ready(function(){
  //轮播
    var t = setInterval('lunbo()', 5000);

  //轮播暂停，重启
    $('div.expert').mouseover(function(){
      clearInterval(t);}).mouseout(function(){    
        t = setInterval('lunbo()', 5000);});
  })
  
var page = 1;
var i = 3;
function lunbo(){    
  var $expert_list = $('div.expert_list');   
  var len_li = $expert_list.find('li').length;    
  var page_count = Math.ceil(len_li/i);    
  if(!$expert_list.is(':animated')) {        
    if (page == page_count-1) {   
        $expert_list.animate({right: '+=405px'}, 'slow')  
                .animate({right:'0px'},1);            
        page = 1;       
   } else {            
        $expert_list.animate({right: '+=405px'}, 'slow'); 
       page++;       
   }    
}

HTML结构

css样式

.expert{    
  height: 202px;    
  overflow:hidden;
  padding:20px 0;
 position: relative;
}
.expert_list{
  width: 1620px;
  position: relative;
}
.expert_list ul{
  height: 202px;
}
.expert_list ul li{
  display: inline;
  float: left;
  margin-left: 10px;
}