從頭開始用jquery編碼javascript carousel滑塊 - 使用變量

Question

所以我的代碼在一定程度上起作用。我有一個滑塊，有一些左邊的&右鍵。

我想要做的是確保它不會以某種方式滑過某個點，因爲會有固定數量的幻燈片。所以我介紹了一個名爲slideWidth的變量，我試圖用它來跟蹤當前的邊距。如果達到一定數量，我只想要一個按鈕就可以工作。我下面的代碼似乎並沒有改變，雖然 - 我可以打左邊的按鈕無限次，卻從沒有正確的...

<script> 
$(document).ready(function() { 

var slideWidth=0; 

if (slideWidth == 0) 
{ 

    $("#slideLeft").click(function(){ 
     $(".slideOverflowHide").animate({"margin-left": "-=1100px"}, "slow"); 
     slideWidth = slideWidth - 1100; 
    }); 

}else if (slideWidth == -3300){ 

    $("#slideRight").click(function(){ 
     $(".slideOverflowHide").animate({"margin-left": "+=1100px"}, "slow"); 
     slideWidth = slideWidth + 1100; 
    }); 

}else{ 

    $("#slideRight").click(function(){ 
     $(".slideOverflowHide").animate({"margin-left": "+=1100px"}, "slow"); 
     slideWidth = slideWidth + 1100; 
    }); 

    $("#slideLeft").click(function(){ 
     $(".slideOverflowHide").animate({"margin-left": "-=1100px"}, "slow"); 
     slideWidth = slideWidth - 1100; 
    }); 

} 

}); 
</script> 

Answer 1

這個代碼裏面出來。你應該在裏執行寬度檢查的點擊功能。

$("#slideLeft").click(function(){ 
    if(slideWidth == 0) { 

Answer 2

的，如果檢查只運行在document.ready一次當slideWidth仍然是0，因此點擊事件永遠不會被連接到slideRight按鈕。

此外，if檢查需要在點擊事件中移動，因此每次單擊其中一個按鈕（左側或右側）時都會運行。

另外，您只需爲每個按鈕附加一次點擊事件。我可以看到你想要做兩次。