固定Navbar打开展开菜单

我在本网站上提供帮助：www.noyoco.com。我最近添加了一个脚本，用于在用户滚动时将导航栏固定在顶部。固定Navbar打开展开菜单

<script type="text/javascript"> 
    $(document).ready(function() { 
    var s = $("#main-nav"); 
    var pos = s.position();  
    $(window).scroll(function() { 
     var windowpos = $(window).scrollTop(); 
     if (windowpos >= pos.top) { 
      s.addClass("stick"); 
     } else { 
      s.removeClass("stick"); 
     } 
    }); 
}); 
</script>

但我不明白为什么展开菜单被打破。

正常工作时，顶部（脚本是关闭的），破碎时脚本（如果你有滚动）

有人能提供帮助的？谢谢！

来源

2016-04-25 Eric NEMO

这是因为第二个菜单不在导航容器的绝对位置。当您使用主菜单进行切换时，仅在display: block;和display: none;。

为了解决这个问题，你可以像这样在父容器上添加一个相对位置：

.multi-level-nav { 
    position: relative; 
}

和绝对位置，菜单上的子菜单：

.tier-2 { 
    position: absolute; 
    left: 0; 
    right: 0; 
    z-index: 2; /* to be above the slideshow */ 
}

希望有所帮助。

编辑

这是因为这个选择也，你有当它成为fixed改变它，因为结构的变化：

.nav-row ul ul { 
    display: none; 
}

来源

2016-04-25 16:12:42

嘿！感谢您的帮助！我在我的样式表中添加了这些元素，并重建了我的脚本：但它不工作。我做错了吗？ –

也许最好在子菜单中使用一个类，所以你完全可以**定位到正确的一个，而不是'.nav-row ul ul'，如果你改变结构可以瞄准其他东西 –

Hey文森特，感谢您的帮助。其实解决方案非常简单，我只需要在我的脚本中使用另一个Jquery选择器：var s = $（“＃main-nav .multi-level-nav”）现在可以正常工作！ –

固定Navbar打开展开菜单

回答

相关问题