在jquery中的某一点停止滚动

Question

我需要创建平滑滚动到使用jQuery的ID的。

下面是我的代码：

  var $root = $('html, body');
  $('a[href*=#]').click(function() {
      var href = $.attr(this, 'href');
      $root.animate({
          scrollTop: $(href).offset().top
      }, 500, function () {
          window.location.hash = href;
      });
      return false;
  });

它对我来说工作得很好。但是有一件事，我需要在页面顶部的某一点停止滚动。例如，从顶部开始的200px。

在这个阶段，它总是滚动到页面的顶部。

有人能告诉我如何修改这段代码吗？谢谢。

Answer 1

通过添加以下内容：

(($(href).offset().top >= 200 ) ? $(href).offset().top : 200)

它检查元素离顶部有多远，如果它超过200px，它会滚动到它，否则它会从顶部滚动到200px

下面是新的代码：

  var $root = $('html, body');
  $('a[href*=#]').click(function() {
      var href = $.attr(this, 'href');
      $root.animate({
          scrollTop: (($(href).offset().top >= 200 ) ? $(href).offset().top : 200)
      }, 500, function () {
          window.location.hash = href;
      });
      return false;
  });

Answer 2

如果我没理解错的话，你有像header这样的高度，例如200px和position:fixed到顶部。并且您当前的脚本滚动太高，隐藏了标题下的哈希标题。

因此，如果这是正确的，你只需要从$(href).offset().top中减去标题高度(例如scrollTop: $(href).offset().top-200)

jsFiddle

Answer 3

将此行scrollTop: $(href).offset().top更改为scrollTop: $("body").offset().top + 200

这将占据真正的顶部位置(0)，然后您可以操作您的滚动以获得所需的位置