从头开始用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检查需要在点击事件中移动，因此每次单击其中一个按钮（左侧或右侧）时都会运行。

另外，您只需为每个按钮附加一次点击事件。我可以看到你想要做两次。