맨 위로

[JS] 페이지 상단(하단)으로 이동하는 버튼 구현하기

버튼 클릭 하나만으로 웹 페이지의 상단으로 이동하는 기능을 구현해보겠습니다. 코드 맨 위로 .moveTopBtn { position: fixed; bottom: 1rem; right: 1rem; width: 4rem; height: 4rem; background: #000; color: #fff; } 간단한 HTML 코드로 버튼을 만들어 줍니다. 대부분의 해당 버튼은 페이지 오른쪽 하단에 위치하기에 fixed 속성을 통해 고정시켜주었습니다. const $topBtn = document.querySelector(".moveTopBtn"); // 버튼 클릭 시 맨 위로 이동 $topBtn.onclick = () => { window.scrollTo({ top: 0, behavior: "smooth" }); ..