오버플로에서 오프셋 문제 Div

높이가 고정되어 있고 오버플로가있는 div 내부에서 사용할 때 JQuery 오프셋에 문제가 있습니다.오버플로에서 오프셋 문제 Div

이 div에는 두 개의 열, 기본 및 세로 막대가 있습니다. 사이드 바에있는 div 중 하나가 div에 스크롤되어 상단에 도달 할 때까지 기다렸다가 그곳에 머물러 있기를 원합니다. 스크롤 않습니다 http://jsfiddle.net/zsJAr/53/

사업부를하지만 효과적으로의 상단 부분을 차단, 사업부의 상단을지나 스크롤 할 때까지이 상단에 머물 시작되지 않습니다

나는 데모는 여기에서 설정 한 div.

도움을 주시면 감사하겠습니다. 것으로,

http://jsfiddle.net/maniator/qaVnY/

$(document).ready(function() { 

    // move the share this widget with the window 
    if ($('#scrollingContent').length > 0) { 
     var $widget = $("#scrollingContent"); 
     var $window = $("#overFlowDiv"); 
     var $topOffset = $('h1').height(); 
     var $offset = $widget.offset(); 
     var $initialMargin = $widget.css('marginTop'); 

     $window.scroll(function() { 
      if ($window.scrollTop() > ($offset.top)) { 
       $widget.stop().animate({ 
        marginTop: ($window.scrollTop() - ($offset.top - $topOffset)) 
       }); 
      } else { 
       $widget.stop().animate({ 
        marginTop: $initialMargin 
       }); 
      } 
     }); 
    } 
})

출처

2011-08-04 Mouseman

당신은 <h1>가 오프셋 상단을 필요로 #scrollingContent div를 훨씬 더 잘리는 것으로 보입니다.

출처

2011-08-04 20:35:04 Neal

흠 작업 듯 : – Mouseman

@Mouseman, 바이올린을 새로 고침, 약간의 오류가있었습니다. 현재 수정되었습니다 – Neal

바이올린은 예제이며 실제 페이지가 아닙니다. 문제의 전체 페이지는 페이지 상단에 메뉴가있는 iframe에서로드되고 페이지의 나머지 부분은 오버플로 div (iframe 상단에 메뉴 유지)가됩니다. 나는 원래 문제를 뺄셈하여 원래의 문제를 해결했습니다. 'topoffset'은 메뉴의 높이입니다. 내가 보는 것은 당신이 당신의 예에서 행한 것입니다. 방금 스크립트가 일반 창에서 작동하므로 '해킹'하는 것으로 생각했습니다. 오버플로 된 div에서 제대로 작동하지 않는 것 같습니다. 하지만 지금은 작동합니다. – Mouseman

좀 덜 일반적인, 그러나 이것은 ... 나를 위해

$window.scroll(function() { 
if ($window.scrollTop() > $offset.top) { 
$widget.stop().animate({ 
    marginTop: ($window.scrollTop() -(180 - $offset.top)) 
});

출처

2011-10-25 18:01:40 Austin

오버플로에서 오프셋 문제 Div

답변

관련 문제