修复了 .js 页面打桩脚本顶部的导航栏答案

【问题标题】：Fixed nav bar on top of .js page piling script修复了 .js 页面打桩脚本顶部的导航栏
【发布时间】：2016-09-08 20:20:17
【问题描述】：

我试图在我的网页顶部放置一个固定的导航栏，但我卡住了。

我正在使用页面堆积 javascript 效果，这可能是它无法按预期工作的原因。这是piling.js的效果demo

我尝试在我的代码顶部添加常用的导航标签，但它会将部分向下推，并且在滚动到第二部分后不会保持可见。

<nav>
    <ul>
       <li><a href="default.asp">Home</a></li>
       <li><a href="news.asp">News</a></li>
       <li><a href="contact.asp">Contact</a></li>
       <li><a href="about.asp">About</a></li>
    </ul>
</nav>

任何想法为什么它不起作用？

【问题讨论】：

在 css 中使用 z-index 将您的导航分层放在分页 div 的顶部。
我也试过了，但没有雪茄。我添加了“z-indexer：100；”在css中导航标签，它什么也没做。
将该css和导航添加到codepen演示
我注意到该位置在您的 css 中拼写错误导致问题:)
哦，我的错 :) 不幸的是，问题仍然存在。我更新了 codepen 演示。

标签： javascript jquery html css

【解决方案1】：

添加 z-index: 100;导航（css）修复它。

nav {
   width: 100%;
   position: fixed;
   top: 0;
   z-index: 100;
}

Fixed demo

【讨论】：