函数scrollTo（id）中的jquery偏移问题

Question

我在这个网站上工作：Website

这是一个单页网站，我使用 scrollTo(id) 在这里查看代码：

function scrollTo(id) { 
  $('html, body').animate({scrollTop: $(id).offset().top - 50}, 1000);
}

问题是，当您在主页顶部尝试按下链接时，偏移量不起作用，并且几乎使您位于您要求的部分（页面）下方。 但是，如果您滚动到页面底部，然后按一个链接，偏移量就像一个魅力，它会让您在您要求的每个部分的顶部。

您可以查看我的源代码，我有一个 js.js 文件，它应该显示我正在使用的所有功能，也许还有一些我没有注意到的其他错误。 真的需要你的帮助:)！希望你能看到我做错了什么。

Answer 1

我认为是因为你的菜单。

当您在页面顶部时，您的菜单有一个静态位置，这也意味着菜单的高度被添加到浏览器滚动到的像素数中.

但是当浏览器向下滚动到该位置时，菜单会变为固定位置，这意味着菜单的高度从您想要的元素的顶部偏移量中减去滚动到。

就代码而言，我只需将这一小段 CSS 添加到正文中即可。

body.tiny { padding-top: 60px; }

假设 60 像素是菜单的高度。当菜单改变到固定位置时，高度将被添加到bodys padding，像以前一样向下推内容。

这样，当菜单将其位置更改为固定和反向时，您也将获得更平滑的滚动。