Javascript 在最后一幅图像上停止.animate（）

我正在尝试创建一个图像库，使用向上/向下按钮进行滚动。到目前为止，我去动画，但现在我需要让它停止在第一个和最后一个图像

这就是我到目前为止得到的（不介意按钮，我仍然需要对它们进行操作，但它们在那里，顶部和底部的红色框）

谢谢

$(document).ready(function() {

    $(".down_button").click(function () {    
       $(".scroll-products").animate({marginTop: '-=700px'}, 300);
    });

    $(".up_button").click(function () {
       $(".scroll-products").animate({ marginTop: '+=700px' }, 300);
    });
});

---

我不会这样做，但按照你开始的方式，我会让这个JS来做：

$(document).ready(function(){
  var curIndex = 0;
  var height = 700;
  var maxHeight = 0;
  var allImages = document.getElementsByClassName("sidebar_images");
  for(var i=0; i<allImages.length; i++) {
    maxHeight += allImages[i].offsetHeight;   
  }
  var maxIndex = Math.ceil(maxHeight/height);

  $(".down_button").click(function () {
    if(curIndex < maxIndex) {
      $(".scroll-products").animate({marginTop: '-='+height+'px'}, 300);
      curIndex++;
    }
  });
  $(".up_button").click(function () {
    if(curIndex > 0){
      $(".scroll-products").animate({ marginTop: '+='+height+'px' }, 300);
      curIndex--;
    }
  });
});

$（文档）.ready（函数（）{
var-curIndex=0；
var高度=700；
var maxHeight=0；
var allImages=document.getElementsByClassName（“侧边栏图像”）；
对于（var i=0；i.
使用
if
语句。
if（！$（'.scroll products'）.css（“页边距顶部”）>max）
你对我的代码有任何疑问吗？它有帮助吗？如果它不能提供你想要的东西，我可能会进一步帮助你。如果有，你能接受它吗？嗨，我不想使用var高度，因为我计划在更多的画廊中使用它，并且希望我能将最后一张图片放在div的底部（没有显示所有的红色区域）。我发现了这个，但我真的不希望它这么复杂。有什么建议吗？也许是一些链接？