페이지로드시 jQuery가 앵커 위치로 이동

페이지로드시 jQuery가 앵커 위치로 이동

---

다음과 같은 간단한 페이지 설정이 있습니다.

<div id="aboutUs">
  About us content...
</div>
<div id="header">
  Header content...
</div>

페이지가로드 될 때 자동으로 아래로 스크롤 (애니메이션 필요 없음) 할 페이지가 필요 #header하므로 사용자가 위로 스크롤하지 않는 한 About Us div를 볼 수 없습니다.

#aboutUs 높이가 고정되어 있으므로 높이를 결정하는 데 변수가 필요하지 않습니다.

나는 우연히 이 다른 질문 및 내 상황에 대한 해답의 일부를 수정하려고했으나 아무 일 듯합니다.

어떤 도움을 주시면 감사하겠습니다.

---

기술

jQuery .scrollTop()와 .offset()방법을 사용하여이 작업을 수행 할 수 있습니다.

내 샘플과이 jsFiddle 데모를 확인하십시오.

견본

$(function() {
    $(document).scrollTop( $("#header").offset().top );  
});

추가 정보

• jsFiddle 데모
• jQuery.scrollTop ()
• jQuery.offset ()

---

JQuery의 scrollTo방법 을 시도 했습니까 ? http://demos.flesler.com/jquery/scrollTo/

또는 JQuery를 확장하고 사용자 지정 멘토를 추가 할 수 있습니다.

jQuery.fn.extend({
 scrollToMe: function () {
   var x = jQuery(this).offset().top - 100;
   jQuery('html,body').animate({scrollTop: x}, 400);
}});

그런 다음이 메서드를 다음과 같이 호출 할 수 있습니다.

$("#header").scrollToMe();

---

페이지 하단의 닫는 Body 태그 바로 앞에이 코드를 넣으십시오.

<script>
    if (location.hash) {
        location.href = location.hash;
    }
</script>

jQuery는 실제로 필요하지 않습니다.

참고 URL : https://stackoverflow.com/questions/8884230/jquery-move-to-anchor-location-on-page-load