網站固定菜單欄

Question

好吧，我一直在創建自己的視差滾動網站，我不能弄清楚固定菜單欄。

我希望菜單欄出現在網站的2/3部分，當用戶滾動瀏覽該頁面時，我希望它在頁面的其餘部分向下滾動時固定到頁面的頂部。對不起，如果我的術語很糟糕，如果它有幫助，我希望菜單欄的功能與此網頁上的功能完全一樣。

所以基本上我不知道如何在CSS中做到這一點，所以如果有人可以幫助這將是偉大的。

http://alwayscreative.net/

謝謝:)

Answer 1

能THIS把你帶入正確的方向？ 或者ANOTHER一個

<div class="header"><strong>Header</strong></div> 
<div class="nav"><strong>Navigation Bar</strong></div> 
<div class="content"></div> 
<style> 
body{ 
    margin: 0; 
} 
.header{ 
    height: 50px; 
    background-color: #000; 
    font-size: 16px; 
    text-align: center; 
    color: #fff; 
    padding-top: 3%; 
} 
.nav{ 
    height: 30px; 
    background-color: #D7D7D7; 
    font-size: 16px; 
    text-align: center; 
    color: #000; 
    padding-top: 5px; 
    width: 100%; 
} 
.content{ 
    height: 1200px; 
} 
</style> 

JS：

<script type="text/javascript"> 
$(document).ready(function(){ 
    $(window).scroll(function(){ 
     var scrollTop = 90; 
     if($(window).scrollTop() >= scrollTop){ 
      $('.nav').css({ 
       position : 'fixed', 
       top : '0' 
      }); 
     } 
     if($(window).scrollTop() < scrollTop){ 
      $('.nav').removeAttr('style'); 
     } 
    }) 
})</script>