top-down 滚动后导航栏可见点 auto-adjusts

Question

已将粘性导航栏 (jsfiddle) 放在一起，只有在用户从文档顶部向下滚动 10 像素后才能看到该导航栏。然而，如 fiddle 中所见；使用：

$(window).scroll(function () {
    if ($(this).scrollTop() > 10) {
     document.getElementById('navig').style.visibility = 'visible';

这仅在代码为运行之后的第一个实例中有效。在随后的类似操作中（完全向下滚动文档 并再次向上滚动）在同一个 session 中，导航栏进入外观远低于 10px。它仅在刷新时再次起作用（rereun），并且再次起作用，仅从上到下滚动的第一个实例。

此外，我希望效果在向上滚动时起作用，即。当用户移过该点时，固定导航栏应在 header 的底部变为绝对导航栏。当从顶部滚动超过 10px 时它应该隐藏。没有 scrollBottom() 函数，那么这是如何处理的？

此 fiddle 已加载 jquery：https://jsfiddle.net/6ss64s7e/

如何解决这些问题？（对不起，我是 javascript 的新手）。

Answer 1

在您 return 到值 position:absolute; 之前，您必须删除您添加的所有其他属性，因为它们不会被自动删除 - 所以，您不需要 top:0; 了。

您可以通过将空字符串传递给它的值来删除 top:0; 属性，如下所示：

$('#navig').css({'position':'absolute','top':''});

滚动及其方向的检测见this question。

Navbar visibility point auto-adjusts after top-down scrolling