JSFiddle에 몇 가지 코드가 있습니다.다른 div의 맨 위로 고정 div 스크롤을 만드시겠습니까?
내가 당신에게 더 명확하게 설명하자
을 나는 #top_bar 항상 스크롤 ID 하이퍼 링크의 HREF 값 사업부의 상단에 정확하게 유지하고자 할 때 다른 손으로 그 위에 사용자가 클릭 (#top_bar의 아래쪽 테두리는 대상 div 인 경우 위쪽 테두리 옆에 있습니다. 의 당신이 DIV4 링크를 클릭한다고 가정 해 봅시다
는 #top_bar는 화면의 상단에 고정되며, 윈도우는 #DIV4로 이동하지만, #top_bar 너무 #DIV4의 일부 내용을 다룰 것입니다.
어떻게 해결할 수 있습니까?
먼저 문서 머리 부분에 코드를 감싸듯이 jsfiddle이 실행되고 있지 않습니다. 나는 그것을 바로 잡았다. http://jsfiddle.net/maYHb/44/에 업데이트 된 js를 확인할 수 있습니다.
이제 귀하의 질문에 답하십시오. html 및 body 태그를 애니메이션으로 스크롤했습니다. 그리고 div에 숫자를 표시하고 싶습니다 (예 : 메뉴 막대 아래에 정확한 꼭지점을 설정하고 그 뒤에 있지 않음). 메뉴 높이와이 요소에 부여한 여백을 고려하지 마십시오. 당신도 그것을 고려하고 있습니다. 위의 바이올린을 확인하십시오. 이 코드를 추가했습니다.
var dest_pos = $(anchor).offset().top-38-40; // 38px for menu div height and 40 px for margin.
$('html, body').animate({scrollTop: dest_pos}, 1000);
일반적인 여백과 구조로 CSS를 조정하면 원하는 결과가 출력됩니다. 그때까지 나는 CSS를 개선하려고 노력할 것이다.
몸체에 애니메이션 스크롤을주는 것보다. div 래퍼로 지정하십시오.