JQuery：在頁面刷新時獲取滾動位置

Question

我有導航欄，當您滾動到它時，它將變得固定。導航欄完美地工作。但是，我還有一個輔助導航欄，它在主導航欄下方打開。當主導航滾動到時，輔助導航將變爲固定。

當我的網站刷新頁面時，刷新前的滾動位置得以保留。如果我中途刷新頁面，並嘗試打開輔助導航欄，則不可見。我發現刷新後固定定位已從輔助導航中刪除。但是，如果您從滾動位置向上或向下滾動，代碼將讀取滾動位置，並應用固定位置。

我是JQuery新手，所以我不知道我需要什麼來解決這個問題。我接受建議。我認爲我需要在刷新時獲得滾動位置。然後，我可以應用邏輯來保持輔助導航上的固定位置不被移除。

$(window).scroll(function() {     // assign scroll event listener 
 
\t 
 
\t  var s = $("#primary-nav"); 
 
\t \t var pos = s.position();  // get current position 
 
\t \t $(window).scroll(function() { 
 
     var windowpos = $(window).scrollTop(); 
 
     //s.html("Distance from top:" + pos.top + "<br />Scroll position: " + windowpos); 
 
     if (windowpos > pos.top) { 
 
      $('#secondary-nav').css({ 
 
\t    position: 'fixed', 
 
\t    top: '60px', 
 
\t    zIndex: '505', 
 
\t   }); 
 
     } else { 
 
      $('#secondary-nav').css({ 
 
\t    position: 'static', 
 
\t   }); 
 
    });

Answer 1

我會嘗試把所有的代碼在一個函數調用該函數會在滾動事件，最初在頁面加載。

function navScroll(){ 
 
    
 
    var s = $("#primary-nav"); 
 
    var pos = s.position();  // get current position 
 
    var windowpos = $(window).scrollTop(); 
 
    
 
    //s.html("Distance from top:" + pos.top + "<br />Scroll position: " + windowpos); 
 
    if (windowpos > pos.top) { 
 
     $('#secondary-nav').css({ 
 
      position: 'fixed', 
 
      top: '60px', 
 
      zIndex: '505', 
 
     }); 
 
    } else { 
 
     $('#secondary-nav').css({ 
 
      position: 'static', 
 
     }); 
 
    } 
 
} 
 

 
$(window).scroll(function() { 
 
    navScroll(); 
 
}); 
 

 
$(document).ready(function() { 
 
    navScroll(); 
 
});

Answer 2

使用標頭中的文件準備函數內修復代碼

$(document).ready(function(){ 
// code here 
});