01.プロジェクト » 酪農学園大学

サイドバーが無限にスクロールできる現象
JSの不具合
以下の関数に最大スクロールできる判定がなかった

$(function () {
  var obj = $("#sidebar");
  var offset = $(obj).offset();
  var topPadding = 70;
  $(window).scroll(function () {
    if ($(window).scrollTop() > offset.top) {
      $(obj)
        .stop()
        .animate({
          duration: "fast",
          marginTop: $(window).scrollTop() - offset.top + topPadding,
        });
    } else {
      $(obj).stop().animate({
        marginTop: 0,
      });
    }
  });
});

以下に修正

$(function () {
  var obj = $("#sidebar");
  var offset = $(obj).offset();
  var topPadding = 70;
  var maxScrollHeight = $("#contents").height() - $(obj).outerHeight() - topPadding; // Max scroll limit

  $(window).scroll(function () {
    var scrollTop = $(window).scrollTop();
    if (scrollTop > offset.top) {
      var calculatedMarginTop = scrollTop - offset.top + topPadding;
      // Limit the marginTop to the maximum scroll height
      calculatedMarginTop = Math.min(maxScrollHeight, calculatedMarginTop);

      $(obj).stop().animate({
        duration: "fast",
        marginTop: calculatedMarginTop,
      });
    } else {
      $(obj).stop().animate({
        marginTop: 0,
      });
    }
  });
});