导航栏屏蔽

我想在这里实现的是透明导航栏隐藏底下的任何东西，只留下背景。所以如果你向下滚动页面，那么在固定的导航栏下的任何内容都将被隐藏。我GOOGLE了它，但没有找到任何令人满意的结果。它甚至有可能吗？导航栏屏蔽

这里的演示站点：http://klaunfizia.pl/damian/ 风格：http://klaunfizia.pl/damian/style.css

我现在得到：http://i.imgur.com/6k2yNJbh.jpg 我想达到的目标：http://i.imgur.com/VICvrUDh.jpg

背景图像不牢固，所以导航栏的颜色设置为＃ ff7400不会是一个解决方案。

代码：

 <ul id="menu"> 
      <li> 
       <a href="#"> 
        &nbsp; Home &nbsp; 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        &nbsp; About me &nbsp; 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        &nbsp; Portfolio &nbsp; 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        &nbsp; Contact &nbsp; 
       </a> 
      </li> 

     </ul> 
    </nav> 

<section id="container"> 
    <section id="main"> 
     <h1>hi! My name is Damian</h1> 
     <p class="mainText"> 
      I'm a graphic designer from Poland specializing in web design, 3D modeling, vector graphics and digital drawing. See my portfolio for more information. 
     </p> 
    </section> 
</section>

CSS：

#navbar 
{ 
    height: 80px; 
    width: 100%; 
    position: fixed; 
    -webkit-transform: translateZ(0); 
    z-index: 10; 
    top:0; 
    }

来源

2013-11-21 user2660811

请输入密码。链接不够。外面的驼鹿应该告诉你。 – isherwood

这不够HTML。向我们展示您的所有标题html（导航容器及其上的所有内容）。 –

你为什么不能设置相同的背景颜色和图像的身体吗？

#navbar { 
    background: url(images/background.jpg) #ff7400; 
}

在Chrome开发工具中工作只是丹迪。

来源

2013-11-21 21:48:16 isherwood

假设您的标题/菜单容器具有纯色背景色，这看起来像是一个简单的z索引问题。给你的菜单更高的Z指数。

如果你可以提供更多的代码或jsfiddle，我可以告诉你哪一行的CSS添加/删除/修复。不幸的是你的网站没有加载。

来源

2013-11-21 21:48:58

回答

相关问题