html - 向上滚动到页面顶部时，如何将导航栏保持在顶部？

Question

在 Safari 和 Mac 版 Chrome 等浏览器中，当您在页面开头尝试向上滚动时，您仍然可以向上滚动一点，但会遇到阻力，并且当您松开时页面会弹回。

我的页面顶部有一个导航栏。当用户向上滚动超过页面顶部时，导航栏会随着页面的其余部分向下移动，如本演示视频中所示。即使在此滚动期间，如何使导航栏保持在页面顶部？

Answer 1

我猜你想创建一个“粘性标题”，当你向下滚动时它会留在页面顶部。您可以通过在导航栏上使用 CSS“位置”规则来做到这一点：

position: fixed;
top: 0;

注意：也许这是这个问题的副本。

Answer 2

试试这个解决方案，我只是根据你的 gif 猜测。

1. html,body{overflow:hidden} （或者）
2. #nav{position:fixed;top:0; or margin-top : 0;} （或者）
3. $("#navbar").css("marginTop",'0')

在第三个示例中，您可以尝试使用变量保存您的 css 值，然后使用 if 条件您可以尝试并可能摆脱反弹效果。

Answer 3

我认为唯一的方法是禁用反弹效果。弹跳效果在 HTML 标记本身上起作用，因此没有绝对或固定定位会使其保持不变。尝试在溢出时将隐藏属性应用于 html 标记，如下所示： html {overflow: hidden}