固定位置导航在滚动时闪烁

Question

长时间学习，第一次海报。

这是我的开发网站：http://kcyc.webstuffdepot.com

我使用了一些jquery来添加一个类 - ＆＃39; sticky-header＆＃39; - 到网站的标题。 Sticky-header使标题与用户一起滚动。这是我的CSS：

.sticky-header {
 z-index: 99999;
 position: fixed;
 width: 100%;
 border-bottom: 1px solid #ccc;
 min-height: 60px !important;
 background: #fff;
}

我使用相同的Genesis主题多次使用此设置并且它非常棒。然而，通过这个应用程序，发生了一些奇怪的事情。滚动时，标题会闪烁，与其下方的元素进行交互。

闪烁进入和退出的标题部分始终保持一致，就好像它被一个看不见的页面元素打断一样。我无法在整个网站中找到任何会导致此行为的页面元素。

我想知道你们是不是很好的人可以向我指出一些东西，或者知道CSS的某些方面我试图用它来引起显示混乱。

Answer 1

你必须在你的包装div上设置宽度和位置，因为你将它放在一边并将其设置为50％的宽度。

由于包装器div没有设置宽度，因此包装器不知道要采用的宽度（50％是什么？）。包装器div也需要相对于头部位置来继承z-index。我使用下面的代码，它修复了问题。

.sticky-header .wrap {
  padding: 10px 0px;
  width: 100%;
  position: relative;
}