상단 사이드 바에 고정되어 하단 마우스를 막지 못하도록합니다.

Question

스크롤이 위쪽에서 특정 지점에 도착하면 내 사이드 ​​바 위치가 고정되었습니다. 그러나 페이지 맨 아래에 도착하면 문제가 발생합니다. 사이드 바는 바닥 글에 있습니다 (http://i.stack.imgur.com/ZwjDK.jpg). 사이드 바를 X에서 Y로 고정해야하며 Y에 도착하면 나머지 페이지와 계속 스크롤하지만 어떻게 할 수 있는지 잘 모릅니다.

나는 그런 일을 시도했지만 작동하지 않습니다 :/

$(function() { 
    var NosSortiesTop = $('#NosSorties').offset().top - 50; 
    var StickyNosSorties = function(){ 
     var ScrollTop = $(window).scrollTop(); 
     var NosSortiesWidth = $('#NosSorties').width(); 
     var NosSortiesPadding = (NosSortiesWidth/100) * 4.4; 
     if (ScrollTop > NosSortiesTop) { 
      $('#NosSorties').css({ 'position': 'fixed', 'top':50 }); 
     } else { 
      $('#NosSorties').css({ 'position': 'relative', 'top':'inherit', 'width': NosSortiesWidth, 'padding-left': NosSortiesPadding, 'padding-right': NosSortiesPadding }); 
     } 
    }; 

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

}); 

누군가가 내가 그 문제를 해결 할 수있는 방법 아이디어가? 질문이 조금 이해하기 어렵 기 때문에

Answer 1

JQuery와followTo

var objWindow = this; 
$.fn.followTo = function (pos) { 
    var $this = this, 
     $window = $(objWindow); 

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

$.fn.followTo