2傳送帶滑塊

Question

試圖在同一頁面上添加2個傳送帶滑塊...... 然而，當我下面的代碼和編輯複製與其他滑塊的名字，剛剛過去的一個正常工作！ JS是：

$(document).ready(function() { 

    //rotation speed and timer 
    var speed = 5000; 
    var run = setInterval('rotate()', speed); 

    //grab the width and calculate left value 
    var item_width = $('#slides li', '#slides_2 li').outerWidth(); 
    var left_value = item_width * (-1); 

    //move the last item before first item, just in case user click prev button 
    $('#slides li:first', '#slides_2 li:first').before($('#slides li:last', '#slides_2 li:last')); 

    //set the default item to the correct position 
    $('#slides ul', '#slides_2 ul').css({ 
     'left': left_value 
    }); 

    //if user clicked on prev button 
    $('#prev', '#prev_2').click(function() { 

     //get the right position    
     var left_indent = parseInt($('#slides ul', '#slides_2 ul').css('left')) + item_width; 

     //slide the item    
     $('#slides ul', '#slides_2 ul').animate({ 
      'left': left_indent 
     }, 200, function() { 

      //move the last item and put it as first item    
      $('#slides li:first', '#slides_2 li:first').before($('#slides li:last', '#slides_2 li:last')); 

      //set the default item to correct position 
      $('#slides ul', '#slides_2 ul').css({ 
       'left': left_value 
      }); 

     }); 

     //cancel the link behavior    
     return false; 
    }); 

    //if user clicked on next button 
    $('#next', '#next_2').click(function() { 

     //get the right position 
     var left_indent = parseInt($('#slides ul', '#slides_2 ul').css('left')) - item_width; 

     //slide the item 
     $('#slides ul', '#slides_2 ul').animate({ 
      'left': left_indent 
     }, 200, function() { 

      //move the first item and put it as last item 
      $('#slides li:last', '#slides_2 li:last').after($('#slides li:first', '#slides_2 li:first')); 

      //set the default item to correct position 
      $('#slides ul', '#slides_2 ul').css({ 
       'left': left_value 
      }); 

     }); 

     //cancel the link behavior 
     return false; 
    }); 

    //if mouse hover, pause the auto rotation, otherwise rotate it 
    $('#slides', '#slides_2').hover(

     function() { 
      clearInterval(run); 
     }, 
     function() { 
      run = setInterval('rotate()', speed); 
     } 
    ); 
}); 

//a simple function to click next link 
//a timer will call this function, and the rotation will begin :) 
function rotate() { 
    $('#next', '#next_2').click(); 
} 

我從這個網站驗證碼： http://www.queness.com/post/923/create-a-simple-infinite-carousel-with-jquery 任何人都可以幫助嗎？

Answer 1

正確的jQuery語法多個選擇是：

$('#slides li, #slides_2 li')... 

這就是說，有數不勝數的自由旋轉木馬，在那裏，適當提取，這就完全避免了整個的混亂。

http://bxslider.com