JavaScript 맨 위로 스크롤

Harshit Jindal 2023년10월12일
  1. window.scrollTo()함수를 사용하여 페이지 맨 위로 스크롤
  2. 앵커 태그를 사용하여 페이지 맨 위로 스크롤
  3. jQuery의scrollTo()함수를 사용하여 페이지 맨 위로 스크롤
JavaScript 맨 위로 스크롤

이 튜토리얼에서는 JavaScript를 사용하여 페이지 상단으로 스크롤하는 방법을 설명합니다.

window.scrollTo()함수를 사용하여 페이지 맨 위로 스크롤

창의scrollTo()메소드는 페이지의 특정 위치로 스크롤하는 데 사용됩니다. 스크롤하려는 지점의xy좌표의 두 가지 인수가 필요합니다. xy0으로 전달하여 페이지 상단으로 스크롤 할 수 있습니다.

window.scrollTo(x - coordinate, y - coordinate)

앵커 태그를 사용하여 페이지 맨 위로 스크롤

앵커 태그는 링크를 클릭 할 때 열리는 페이지의 참조를 사용합니다. href속성 값으로#을 전달하면 페이지 상단으로 스크롤됩니다.

<a href="#"> Top of Page </a>

jQuery의scrollTo()함수를 사용하여 페이지 맨 위로 스크롤

scrollTo()함수는 HTML 요소의 수직 스크롤바 위치를 가져 오거나 조작하는 데 도움이됩니다. scrollTo()에 대한 위치 인 하나의 인수를 사용합니다. 이 함수를 사용하여 창 속성에 적용하고 위치 매개 변수를0으로 설정하여 페이지 상단에 도달 할 수 있습니다.

$(window).scrollTop(0);
Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn