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
            });
        }
    });

}

它会归档我想要的内容...当我向下滚动页面等时，它会保持在相同的位置。

问题： 我希望它在到达页面底部时停止滚动。目前，永远不要停止scolling，它会破坏网站。有人告诉我我需要测量加载时的窗口大小 - 不知道如何实现它....有什么例子吗？

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');
      }

    });

  }

});