다른 div에 도달 할 때 부동 div 얻기

Question

페이지와 함께 스크롤되는 사이드 바에 부동 글자 div이 있습니다. 꼬리말에 도달했을 때 코드를 멈추게하는 코드를 추가하는 방법이 있습니까? 행동

참조 코드 : http://openbayou.staging.wpengine.com

div을 떠하는 데 사용

jQuery 코드 : 단지의 Z- 인덱스 뒤에 사이드 바의 z 인덱스를 설정하지 왜

$j=jQuery.noConflict(); 

$j(document).ready(function($) { 

//this is the floating content 
var $floatingbox = $('#one'); 

if($('#primary').length > 0){ 

    var bodyY = parseInt($('#primary').offset().top) - 20; 
    var originalX = $floatingbox.css('margin-left'); 

    $(window).scroll(function() { 

     var scrollY = $(window).scrollTop(); 
     var isfixed = $floatingbox.css('position') == 'fixed'; 

     if($floatingbox.length > 0){ 

      $floatingbox.html(); 

      if (scrollY > 1561 && !isfixed) { 
       $floatingbox.stop().css({ 
        position: 'fixed', 
        top: 10, 
       }); 
      } else if (scrollY < 1561 && isfixed) { 
       $floatingbox.css({ 
        position: 'relative', 
        top: 0, 
       }); 
      } 

     } 

    }); 
} 
}); 

Answer 1

업데이트 : 내 문제의 해결책을 찾았습니다. 이것은 무엇을

$(function() { 
    var msie6 = $.browser == 'msie' && $.browser.version < 7; 
    if (!msie6) { 
     var top = $('#one').offset().top; 
     $(window).scroll(function (event) { 
      var y = $(this).scrollTop() + 20; 
      if (y >= top) { 
       $('#one').addClass('fixed'); 
      } 
      else { 
       $('#one').removeClass('fixed'); 
      } 

      // don't overlap the footer - pull sidebar up using a negative margin 
      footertotop = ($('#footer').position().top); 
      scrolltop = $(document).scrollTop() + 760; 
      difference = scrolltop - footertotop; 
      if (scrolltop > footertotop) { 
       $('#one').css('margin-top', 0 - difference); 
      } 

      else { 
       $('#one').css('margin-top', 0); 
      } 
     }); 
    } 
}); 

은 바닥 글 전에 멈추고 내가 정지 지점을 구성 할 수 있습니다.

내 문제를 해결하는 데 도움을 주셔서 감사합니다.

Answer 2

보행인?

편집 :

$(window).scroll(function() { 
floatingbox = $("#one"); 
      if(floatingbox.length > 0){ 
       //get our current scroll position 
       var scrollY = $(window).scrollTop(); 
       //get the position of the tag cloud relative to the document 
       var contentY = ($("#sidebar .sidebar-tag-cloud").offset().top + $("#sidebar .sidebar-tag-cloud").outerHeight(false)); 
       //calculate the largest possible top margin size before it starts to overlap the footer 
       var lastY = $("#footer").offset().top - $("#one").outerHeight(false); 
       //check if our scroll location is past the bottom of the tag cloud 
       if (scrollY > contentY) 
       { 
        //check if the current top position is less than the maximum position 
        if(floatingbox.offset().top<lastY) 
        { 
         //keep scrolling 
         floatingbox.stop().animate({"marginTop":scrollY-contentY}); 
        }else 
        { 
         //check if we have scrolled back up and have a space at the top 
         if(scrollY<floatingbox.offset().top) 
         { 
          floatingbox.stop().animate({"marginTop":scrollY-contentY}); 
         }else 
         { 
          // hard set to the maximum position 
          floatingbox.stop().css({"marginTop":lastY-contentY}); 
         } 
        } 
       }    
      } 
     }); 

: 나는 당신의 스크롤 기능이 시도 ... 내가 가서 JQuery와이 일 당신이 그것을 원하는 방식으로 만든

을이 결과를 좋아하지 않았다

태그 클라우드 하단의 위치를 ​​구하고 하드 코드 번호 대신 사용하여 좀 더 동적으로 만들었습니다.

Answer 3

최근 jsfiddle을보고 좋아. 나는 당신과 일하도록 그 코드를 수정했다. http://jsfiddle.net/Tgm6Y/4430/ 이것은 애니메이션 지연이 없으며 잘 작동합니다.

$('#one').followTo('#two','#pointFive'); 

은 "#sidebar .sidebar-태그 구름"과의 #footer와 #pointFive와 #two을 교체하고이 코드에서 작동합니다.