固定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打開展開菜單

回答

相關問題