위치를 고정식으로 변경하면 div 스크롤을 방지합니다.

Question

div에 사진 이름 목록이 있습니다. 이름을 클릭하면 다른 div (첫 번째 바깥 쪽)에 사진과 주석이 표시됩니다. 이 두 번째 div가 (메인 윈도우 스크롤바를 사용하여) 스크롤 될 때 첫 번째 div가 함께 스크롤되는 것을 원하지 않습니다. 따라서 사진 div를 열면 div30의 첫 번째 위치가 에서으로 에서으로 바뀝니다. 지금까지 그렇게 좋았습니다.

그러나 사진을 열기 전에 첫 번째 div를 스크롤하면이 div의 값을 고정으로 설정하면 맨 위의 점으로 되돌아 가고 그 위치는 그대로 유지됩니다. 이것을 할 수있는 방법이 있습니까? 왜 그것이 정상으로 뛰어 올까요?

기본적으로 페이스 북에서 사진을 보여주는 것과 동일하게하고 싶습니다. 사진 영역을 스크롤 할 수있는 동안 배경이 고정됩니다.

감사합니다. 더 위/아래 값이없는 것은 기본적으로 그들이 position로 변경되기 전에 (현재 위치를 설정해야합니다이를 방지하기 위해, 이제 0

에 위치하고 의미하기 때문에

Answer 1

고정 DIV 상단으로 이동 fixed) 과 관련하여 (핵심 부분)입니다.

그로부터 제 jsfiddle

JQuery와 부를 참조 : 위치가 고정된다

$('#click').click(function() { 
    var ftop = $('#fixer').offset().top - $(window).scrollTop(); 
    var fleft = $('#fixer').offset().left; 
    $('#fixer').css({position: 'fixed', left: fleft + 'px', top: ftop + 'px'}); 
}); 

전에 현재 최고 [offset().top - (window).scrollTop] 좌표를 계산하고 #fixer의 top 값으로 통과시켰다. $(window).scrollTop()은 고정되어있을 때 #fixer이 항상 시점에 있어야하기 때문에 중요합니다.