選定標題轉到頂部導航欄

Question

這背後是我的代碼：Navigaton Bar Issue

 <header class="header"> 
     <div class="Topheading"> 
     </div> 
     <div class="TopNavigation"> 
      <nav class="leftnav"> 
       <ul> 
        <li><a href="">Test1</a></li> 
        <li><a href="">Test1</a></li> 
        <li><a href="">Test1</a></li> 
        <li><a href="">Test1</a></li> 
        <li style="float:right"> 
         <button class="fedbut">Send Feedback</button> 
        </li> 
       </ul> 
      </nav> 

     </div> 
    </header> 

頂部導航欄是固定的，在右側的導航，當點擊它選擇頁面上的導航項目按標題所選標題將位於頂部導航欄後面。

目前...

但選定的標題應該是低於頂部導航欄。

這樣的...

在此先感謝..

Answer 1

它發生，因爲你是指向e.x #1錨和瀏覽器滾動到這一點。而且由於你的導航欄是固定的，它涵蓋了部分內容。您可以使用JS修復此問題：

$(".cuntnav a").on("click", function(e){ 
    e.preventDefault(); 
    var section_id = $(this).attr("href"); 
    var section_offset = $(""+section_id).offset().top; 

    window.scrollTo(0, section_offset-100); 
});