javascript - 查看最后一项时停止滚动 - 使用 jQuery

Question

我有一个动态项目列表，它具有像幻灯片一样的滚动效果，当显示列表的最后一个项目时，我无法使用箭头设置滚动限制。

知道如何在查看最后一项时停止滚动吗？示例如下: JSFIDDLE

    $('.nextArrow').click(function() {
        //Animate the images to next slide
        $('.thumbs li:eq(0)').animate({"margin-top": "-=80"}, 500);             
    });

    $('.prevArrow').click(function() {
        var marginTopValue = $('.thumbs li:eq(0)').css('margin-top');
        //Animate the image to previous slide
        if (marginTopValue == '0px') {

        } else {
            $('.thumbs li:eq(0)').animate({"margin-top": "+=80"}, 500);
        };
    });

Answer 1

改变

$('.nextArrow').click(function() {
    //Animate the images to next slide
    $('.thumbs li:eq(0)').animate({"margin-top": "-=80"}, 500);             
});

至

$('.nextArrow').click(function() {
        //Animate the images to next slide
  var marginTopValue = parseInt($('.thumbs li:eq(0)').css('margin-top').replace('px', ''));
  if (marginTopValue >= (0-$('.thumbs')[0].scrollHeight))
  {
        $('.thumbs li:eq(0)').animate({"margin-top": "-=80"}, 500);
  }
    });

JSFIDDLE在这里!