[javascript] JavaScript를 사용하여 페이지 상단으로 스크롤 하시겠습니까?

JavaScript를 사용하여 페이지 상단으로 스크롤하려면 어떻게합니까? 스크롤바가 즉시 상단으로 이동하더라도 바람직합니다. 부드러운 스크롤을 찾고 있지 않습니다.



답변

애니메이션을 적용하기 위해 변경이 필요하지 않은 경우 특별한 플러그인을 사용할 필요가 없습니다. 네이티브 JavaScript window.scrollTo 메서드 만 사용하면됩니다. 0,0을 전달하면 페이지가 왼쪽 상단으로 즉시 스크롤됩니다. .

window.scrollTo(x-coord, y-coord);

매개 변수

  • x 좌표는 가로 축을 따른 픽셀입니다.
  • y 좌표는 세로 축을 따른 픽셀입니다.

답변

부드러운 스크롤을 원하면 다음과 같이 해보십시오.

$("a[href='#top']").click(function() {
  $("html, body").animate({ scrollTop: 0 }, "slow");
  return false;
});

<a>태그를 가지고 href="#top"상단으로 부드럽게 스크롤합니다.


답변

이것을 스크롤하여 위로 스크롤하십시오.

<script>
 $(document).ready(function(){
    $(window).scrollTop(0);
});
</script>


답변

부드러운 애니메이션으로 더 나은 솔루션 :

// this changes the scrolling behavior to "smooth"
window.scrollTo({ top: 0, behavior: 'smooth' });

참조 : https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo#Example


답변

이를 위해 jQuery가 필요하지 않습니다. 표준 HTML 태그로 충분합니다 …

<div id="jump_to_me">
    blah blah blah
</div>

<a target="#jump_to_me">Click Here To Destroy The World!</a>


답변

이러한 모든 제안은 다양한 상황에 적합합니다. 검색을 통해이 페이지를 찾을 사람들을 위해, 하나는 줄 수있는 시도. 플러그인이없는 JQuery는 요소로 스크롤합니다.

$('html, body').animate({
    scrollTop: $("#elementID").offset().top
}, 2000);


답변

부드러운 스크롤, 순수한 자바 스크립트 :

(function smoothscroll(){
    var currentScroll = document.documentElement.scrollTop || document.body.scrollTop;
    if (currentScroll > 0) {
         window.requestAnimationFrame(smoothscroll);
         window.scrollTo (0,currentScroll - (currentScroll/5));
    }
})();