函数scrollTo(id)中的jquery偏移量存在问题



我正在这个网站上工作:网站

这是一个一页的网站,我使用scrollTo(id)查看这里的代码:

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

问题是,当你在主页顶部尝试按下链接时,偏移量不起作用,几乎会使你低于你要求的部分(页面)。但是,如果你滚动到页面底部,按下一个链接,偏移量就像一个符咒,它会把你放在你要求的每个部分的顶部。

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

我想这是因为你的菜单。

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

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

在代码方面,我只需将这一小段CSS添加到正文中即可。

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

假设60个像素是菜单的高度。当菜单更改为固定位置时,高度将添加到身体的填充中,将内容像以前一样向下推。

这样,当菜单将其位置更改为固定和反转时,您也会有更平滑的滚动。

最新更新