jQuery的滑塊旋轉功能

Question

我使用的一個小插件，滑塊有2個主要功能旋轉（）和rotateSwitch（）

rotate = function(){  
    var triggerID = $active.attr("rel") - 1; 
    var image_reelPosition = triggerID * imageWidth; 

    $(".paging a").removeClass('active'); 
    $active.addClass('active'); 

    //Slider Animation 
    $(".image_reel").animate({ 
     left: -image_reelPosition 
    }, 500); 

}; 


rotateSwitch = function(){  
    play = setInterval(function(){ 
     $active = $('.paging a.active').next(); 
     if ($active.length === 0) { 
      $active = $('.paging a:first'); //go back to first 
     } 
     rotate(); //Trigger the paging and slider function 
    }, 7000); (7 seconds) 
}; 

rotateSwitch(); 

這種運作良好，如果分頁按鈕如下：

<div class="paging"> 
    <a href="#" rel="1">1</a> 
    <a href="#" rel="2">2</a> 
    <a href="#" rel="3">3</a> 
    <a href="#" rel="4">4</a> 
</div> 

但我的問題（需要風格）是分頁是這樣做的;

<div class="paging"> 
     <ul> 
       <li><a href="#" rel="1">1</a></li> 
       <li><a href="#" rel="2">2</a></li> 
       <li><a href="#" rel="3">3</a></li> 
       <li><a href="#" rel="4">4</a></li> 
      </ul> 
</div> 

然後旋轉不起作用。我認爲這個問題是沒有找到，因爲這行下面的鏈接：（在rotateSwitch（）函數）

$active = $('.paging a.active').next(); 
    if ($active.length === 0) { 
     $active = $('.paging a:first'); //go back to first 
    } 

如果是這樣的錯誤，如何找到列表中的下一個（）的孩子嗎？

Answer 1

是的，a.active沒有在li裏面的兄弟姐妹，因此沒有.next()的結果。您需要遍歷父級以先找到下一個li，然後再跳回到以下鏈接：

$active = $('.paging a.active').parent().next().find('a');