Jquery垂直列表滑块不会重复多次

Question

我有一个垂直滑块，除非需要滚动多次时才能正常工作。

view slider

这是代码

$(document).ready(function() { 
    var speed = 1050; 
    var elementHeight = 106; 
    var countElements = $('#portfolio-navigation ul li'); 
    var numberElements = countElements.length; 
    var totalHeight = numberElements * elementHeight; 
    var containerHeight = 742; 

    var currentPlace = elementHeight * 7; 
    var currentDifference = 0; 
    $("#up").addClass("nogo"); 
    $("#down").click(function(event) { 
     $("#down").addClass("nogo"); 
     $("#up").removeClass("nogo"); 
     event.preventDefault(); 
     if (currentPlace >= totalHeight) { 
     } else { // Ellers, continue! 
     currentPlace += elementHeight; 
     currentDifference += elementHeight; 
      $("#portfolio-navigation ul").animate({ top: "-510px"}, speed); 
     } 
    }); 
    $("#up").click(function(event) { 
     $("#down").removeClass("nogo"); 
     $("#up").addClass("nogo"); 
     event.preventDefault(); 

     if (currentPlace <= containerHeight) { 
     } else { // Ellers, continue! 
     currentPlace -= elementHeight; 
     currentDifference -= elementHeight; 
      $("#portfolio-navigation ul").animate({ top: 0 + "px"}, speed); 
     } 
    }); 
}); 

我希望能够使滑块向下滚动不止一次。

任何想法？

干杯 聂

Answer 1

我不知道我理解你的问题，但通常你想的UL向上和向下，直到它转移它到达列表的末尾。当你有一个固定高度的容器时，这很容易做到。只需在下一个按钮中减去510px的动画，而不是将其设置为-510px。之后，使用totalheight和containerheight变量来确定何时禁用按钮（我会建议使用if/else语句而不是添加和删除类）。