더북(TheBook)

11.4.4 웹 브라우저의 스크롤 이동하기

window 객체의 scrollTo() 메서드는 웹 브라우저의 스크롤 위치를 특정 좌표로 이동하게 합니다. 그리고 scrollBy() 메서드는 웹 브라우저의 스크롤을 현재 위치에서 상대적인 위치로 이동하게 합니다. 두 메서드는 기본으로 매개변수에 x좌표와 y좌표를 전달받습니다.

형식

window.scrollTo(x좌표, y좌표);
window.scrollBy(x좌표, y좌표);

예를 들어, 다음과 같이 작성하면 scrollTo() 메서드를 몇 번을 호출하더라도 가로는 100px, 세로는 200px의 위치로 스크롤이 이동합니다. 그러나 scrollTo() 메서드 대신에 scrollBy() 메서드를 사용하면 웹 브라우저 스크롤의 현재 위치에서 상대적인 위치로 움직이기 때문에 메서드를 호출할 때마다 웹 브라우저의 스크롤이 가로 방향으로 100px, 세로 방향으로 200px씩 계속 이동합니다.

11/04/scrollToBy.html

window.scrollTo(100, 200); 
window.scrollBy(100, 200);
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.