修复div导航从滚动时隐藏的问题

Question

我有这个示例HTML5页面，该页面具有导航和粘贴在JSFiddle上的内容区域。

问题是，垂直滚动时<div id="nav">并没有固定。 即使垂直滚动，如何将导航固定在浏览器顶部？

Answer 1

DEMO

body {
    margin: 0px;
    width: 100%;
    height: 120%;
    background: red;
}
#nav {
    position: fixed;
    width: 100%;
    z-index: 99;
    height: 25px;
    background: blue;
}

Answer 2

使用position:fixed和z-index属性（您的问题归因于图层： fixed div位于#area div下）：

#nav{
   position:fixed;
   top:0;
   width:100%;
   height: 25px;
   z-index:50;
   background: blue;
}

例

Answer 3

创建另一个隐藏的导航（与已经使用的导航相同），并在用户向下滚动足够时显示它。

这是一个很好的教程 。

这是我网站上一些经过编辑且有效的示例 。