고정 div 세로 스크롤 제한

Question

왼쪽 열에 고정 세로 막대가 있고 오른쪽 열에 페이지 내용이있는 2 열 레이아웃이 있습니다. 나는 또한 바닥 글을 가지고있다. 고정 된 사이드 바를 페이지 콘텐츠 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); 

}); 

당신이 어떤 아이디어를 감사가 있다면 정말 기쁠 것입니다!

Answer 1

이 문제가 해결 된 것 같습니다. 내 사이드 ​​바에 동적으로로드되는 페이스 북 위젯이있어서, 아직로드하지 않았기 때문에 페이지를 열면 스크립트가 Facebook div 높이없이 높이를 가져옵니다. 방금 페이스 북 위젯이로드 된 후 스크롤 스크립트를로드하기 위해 몇 가지 조작을했습니다.

심지어 더 좋은 방법 -이 위젯을 컨테이너에 넣고 css에서 수동으로 높이를 지정하는 것입니다.