바닥 글을 따라 가면서 멈추는 Div 만들기 방법? - jquery

Question

나는이 튜토리얼을 사용했다 : http://jqueryfordesigners.com/fixed-floating-elements/

나는이 코드와 함께 나왔다.

$(document).ready(function(){ 
var msie6 = $.browser == 'msie' && $.browser.version <7; 

if (!msie6) { 

var top = $('#right-sponsor').offset().top; 

$(window).scroll(function() 
     { 

    var y = $(window).scrollTop(); 

    if(y >= top){ 
    $('#right-sponsor').addClass('fixed'); 
      } 
    else  { 
    $('#right-sponsor').removeClass('fixed'); 
      } 

     }); 

    } 
}); 

는 튜토리얼은 여기에 부드러운 전환을 만들기 위해 또 다른 "래퍼 사업부"로 내가 이동하려는 사업부를두고 제안 내가 사용하고있어 CSS입니다.

#sponsorWrapper { 
    position:absolute;top:215px;right:5px; 
    width:232px; 
} 

#right-sponsor{ 
    position:absolute;top:0px; 
    padding:2px 10px 10px 10px; 
    width:215px; 
    margin: 5px 0 5px 5px; 
    } 

#right-sponsor.fixed{ 
    position:fixed;top:0; 
    } 

위대한 작품입니다!

하지만 페이지 하단으로 내려 가면 내 바닥 글과 겹칩니다. 어떻게해야합니까? Ymax 값을 설정해야 할 필요가 있다고 생각합니다. Ymax 값에 도달하면 멈 춥니 다. 그러나, 나는 그것을 어떻게하는지 정말로 모른다. 설명 할 수있는 튜토리얼을 알고 있거나 아는 분. 나는 jquery를 전혀 모른다.

감사합니다,

Answer 1

당신은 당신의 용기의 높이를 결정하기 위해 jQuery의 .height의() 함수를 사용하는 것이 좋습니다. 그런 다음 메뉴의 높이를 빼고 Ymax 값을 그 기준으로 삼습니다.

var heightOfMenu = $('#right-sponsor.fixed').height(); 
var ymax = $('#float_container').height() - heightOfMenu; 

당신은 다음과 같은 시도 할 수 바닥 글을 겹쳐 나던 당신의 요소의 래퍼 가정의 요구 :

Answer 2

에 맞게이 약간 수정할 수 있습니다 : 다음

var maxY = $('#right-sponsor').parent().height() - $('#right-sponsor').outerHeight(); 

scroll 이벤트 함수 끝에 다음을 추가하십시오.

if(y > maxY) { 
    $('#right-sponsor').removeClass('fixed'); 
}