限制固定div垂直滾動

我有2列布局，左邊是固定邊欄，右邊是頁面內容。我也有頁腳。我希望我的固定邊欄向右滾動到頁面內容div末尾的座標。限制固定div垂直滾動

但是，如果側邊欄的高度大於頁面內容的高度，我需要自動爲頁面內容div分配新的高度。此代碼適用於第一種情況（內容高於邊欄），但第二種情況僅在我再次加載頁面一次的情況下才有效（例如，當我從另一頁面訪問此類頁面時，腳本不會分配新的高度，但是當我重新加載頁面，它）

這裏是代碼：

$(window).load(function(){ 
    var windw = this; 
    var contentHeight = $('#content').height(); // fetch Сontent div height 
    var sideHeight = $('.sidebar-nav-fixed').height(); // fetch sidebar div height 
    $.fn.followTo = function (pos) { 
     var $this = this, 
      $window = $(windw); 

     $window.scroll(function(e){ 
      if ($window.scrollTop() >= pos) { 
       $this.css({ 
        position: 'absolute', 
        top: pos 
       }); 
      } else { 
       $this.css({ 
        position: 'fixed', 
        top: 100 
       }); 
      } 
     }); 
    }; 

if (sideHeight > contentHeight) { 
    $('#content').css ({ 
    height: contentHeight + (sideHeight - contentHeight) 
}), 
    contentHeight = $('#content').height() // Assign a new height to page content div 
} 
    $('.sidebar-nav-fixed').followTo(contentHeight - sideHeight); 

});

我會很高興，如果您有任何意見謝謝！

來源

2012-09-14 Ilya Cherevkov

看起來像我解決了這個問題。在我的邊欄中，我有Facebook動態加載的小部件，所以當我打開頁面時，腳本獲取高度而無需Facebook div高度，因爲它尚未加載。在加載了Facebook小部件後，我只做了很少的操作來加載滾動腳本。

甚至更好的方法 - 把這個小部件放入容器中，並在css中手動指定高度。

來源

2012-09-16 11:26:48

限制固定div垂直滾動

回答

相關問題