SlickNav 菜单覆盖徽标，使 link 无法点击

Question

我已经将 SlickNav 框架用于此站点上的汉堡菜单 (http://culturepop.com/)，但是当它打开时，包含菜单的 div 会遮住左侧的徽标.虽然您可以看到徽标，但无法再点击它。我试图在下拉菜单保持 100% 宽度但按钮刚好适合 space 并且不会遮盖按钮的位置获得它。尝试使用 z-index，但汉堡菜单不再可点击。基本上，一个双赢的局面。这是我的代码：

HTML（简体）

<body>
<div class="slicknav_menu"></div>
<div id="site-cphead">
        <div class="site-branding">
            <div class="site-title"><a href="#" rel="home"><img src="logo.svg" alt=""></a></div>
        </div><!-- .site-branding -->
</body>

CSS

 .slicknav_menu {
    font-size: 16px;
    box-sizing: border-box;
}
.slicknav_menu {
    background: transparent none repeat scroll 0% 0% !important;
    width: 100%;
    position: absolute;
    font-family: "proxima-nova-alt-condensed",sans-serif;
    font-size: 18px;
    padding: 11px 5px 0px !important;
    z-index: 9999;
}
.slicknav_menu {
    display: block;
}

Answer 1

这样就可以了。 :)

.smart-slider-canvas-inner
  z-index: 0

.slicknav_menu
  z-index: 1

.site-title a
  display: block
  position: relative // needs a position for the z-index to kick in
  z-index: 2

SlickNav 菜单覆盖徽标，使 link 无法点击

SlickNav menu covering over logo making link unclickable

javascript

css

jquery

z-index

slicknav