使用.animate（）點擊滑動div：如何限制位移？

我用jQuery創建了一個非常基本的滑塊。有兩個箭頭叫做.theftft和.theright，它們在點擊時會移動一些div內容，所以一個水平的圖片庫在一個950px的範圍內從一邊移動到另一邊。這是代碼：使用.animate（）點擊滑動div：如何限制位移？

$(".theright").click(function() {    
$(".mymove").animate({ 
     left: "-=950px", 
     }, 1500); 
}); 

$(".theleft").click(function() {     
$(".mymove").animate({ 
     left: "+=950px", 
     }, 1500); 
});

的HTML是非常簡單的：

<div class="mymove" style="position:relative"> 
    <ul> 
     <li> 
      <img src="" title="" alt=""> 
     </li> 
     <li> 
      <img src="" title="" alt=""> 
     </li> 
     <li> 
      <img src="" title="" alt=""> 
     </li> 
     <li> 
      <img src="" title="" alt=""> 
     </li> 
    </ul> 
</div>

我的問題是，當頁面加載，如果我做的第一件事就是點擊左箭頭，畫廊下車視迷路在右側，也就是我還沒有找到一種方法來「限制」滑塊動作......

你知道的一些方法來改善呢？

非常感謝。

來源

2010-08-26 Peanuts

您需要某種計數器來跟蹤滑塊的位置。

所以，如果它最初從0開始，有這樣的事情：

$(".theleft").click(function() {     
    if (slider_pos > 0) { 
     $(".mymove").animate({ 
      left: "+=950px", 
     }, 1500); 
     // Then update slider_pos here i.e. view_pos += 950; 
    } 
});

來源

2010-08-27 01:34:31 going

謝謝！只是一個問題，如何確定「slider_pos」值的語法？像使用PHP的東西？我應該在jquery代碼片段中的其他任何內容之前計算它嗎？類似於var slider_pos = <？php numberofimages（）; ？> – Peanuts 2010-08-28 13:34:11

您可能想要使用全局JavaScript變量，因此在聲明slider_pos時不要使用var。也不要在你的javascript中使用php，這是不好的做法，主要是因爲它不可靠。你應該做的是使用jQuery（或JavaScript）來計算圖像元素的數量。像這樣： var num_images = $（「。mymove ul li img」）。length – going 2010-08-29 23:04:01

使用.animate（）點擊滑動div：如何限制位移？

回答

相關問題