JS：粘性导航栏的脚本不是运行

Question

出于某种原因，在我的网页上，粘性导航栏的 javascript 根本不是运行。这里是jsfiddle。导航栏（亮橙色）横跨页面顶部 - 在页眉底部。该脚本设置为在用户滚动经过一个点然后再经过另一个点后使导航栏可见，这意味着在 .offset().top;.[=13= 的帮助下将其固定在视口的顶部]

我已经在类似的实现中尝试了完全相同的脚本并且它有效。将不胜感激任何人的帮助，指出故障。

Answer 1

问题出在您的 html 布局中的 z-index

<header>
        <div class="mainheader">
        <img class="logo" src="images/logoinner.png">
            <img class="detail1" src="images/detail1.png">
        </div>

        <div class="subheader"></div>

        <div id="menu-wrapper">
          <nav id="menu">
            <div class="menu">
              <ul class="menu">
                <li>
                  <img class="logoflag" src="images/logoflag.png">
                </li>
              </ul>
            </div>
          </nav>
        </div>

</header>

<div class="contentwrap">
.....
</div>

您只设置了菜单包装 div 的 z-index，但是 header 的 z-index 仍然小于 z-index divclass="contentwrap"。所以只需增加 header 的 z-index 就可以了。

这里是固定的fiddle:

https://jsfiddle.net/uh6e88n3/6/

JS：粘性导航栏的脚本不是运行

JS: Script for sticky navbar not running

javascript

offset

navbar

JS：粘性导航栏的脚本不是 运行

JS: Script for sticky navbar not running

javascript

offset

navbar

JS：粘性导航栏的脚本不是运行