WordPress jQuery驅動靜態邊欄

Question

我使用下面的調整jQuery代碼來浮動我的WordPress頁面邊欄。

function loadStaticSidebar(){ 

    //floating sidebar menu 
    var $sidebar = $("#sidebar"), 
    $window = $(window), 
    offset  = $sidebar.offset(), 
    topPadding = 15; 
    $window.scroll(function() { 
     if ($window.scrollTop() > offset.top) { 
      $sidebar.stop().animate({ 
       marginTop: $window.scrollTop() - offset.top + topPadding 
      }); 
     } else { 
      $sidebar.stop().animate({ 
       marginTop: 0 
      }); 
     } 
    }); 

} 

當我向下滾動頁面等等時，它將我想要的內容歸檔...保持在同一位置。

問題： 我希望它在到達頁面底部時停止滾動。目前，永遠不會停止捕魚，它會打破網站。有人告訴我，我需要在加載時測量窗口大小 - 不知道如何去實現....任何示例？

Answer 1

試試這個

$(function(){ // document ready 

    if (!!$('#sidebar').offset()) { // make sure "#sidebar" element exists 

    var stickyTop = $('#sidebar').offset().top; // returns number 

    $(window).scroll(function(){ // scroll event 

     var windowTop = $(window).scrollTop(); // returns number 

     if (stickyTop < windowTop){ 
     $('#sidebar').css({ position: 'fixed', top: 0 }); 
     } 
     else { 
     $('#sidebar').css('position','static'); 
     } 

    }); 

    } 

});