부드러운 스크롤이 처리 후 페이지 맨 위로 이동합니다.

Question

jquery와 부드러운 스크롤을 사용하여 페이지 상단에서 URL 해시에서 가져온 앵커로 스크롤하는 기능이 있습니다.

스크롤이 제대로 작동하지만 완료되면 페이지가 맨 위로 재설정됩니다. 여기

이 구현되는 방식이다이 원인이 될 수 무엇

if (hash) { // if hash in the URL 

    $('html, body') 
     .animate({scrollTop:$(window.location.hash) 
     .offset().top - 200 }, 1000); 
    } 

?

Answer 1

가장 큰 문제는 이미지 및 기타 콘텐츠가 아직로드되지 않아서 페이지가 최종 크기를받지 못했기 때문입니다. 이렇게하면 초기 스크롤이로드 된 후 잘못된 위치를 가리 킵니다.

그런 경우에는 콘텐츠가로드 된 후에 스크롤을 수행하는 것이 좋으므로 코드를 $(window).load 방법으로 묶어야합니다.

var hash = window.location.hash; 
$(window).load(function(){ 
    if (hash) { // if hash in the URL 

    $('html, body') 
     .animate({scrollTop:$(window.location.hash) 
     .offset().top - 200 }, 1000); 
    } 
});