IT 수업 9주차 (19) scroll 이벤트

 

 

● SCROLL

스크롤을 내리면 콘솔창에 스크롤이 움직였다고 출력된다.

 

 

이렇게 가로, 세로 스크롤을 움직이면 정보가 나오게 된다.

 

- 가로 스크롤 움직였을 때

 

-세로 스크롤 움직였을 때

 

 

 

 window.scrollX
- 현재 문서의 수평 스크롤 위치
- 뷰포트에서 가장 왼쪽 부분의 가로축 위치를 기준
- 스크롤이 오른쪽으로 이동할수록 값 증가

window.scrollY
- 현재 문서의 수직 스크롤 위치
- 뷰포트에서 가장 위쪽 부분의 세로축 위치를 기준
- 스크롤이 아래쪽으로 이동할수록 값 증가

 

 

 

 

 

- 현재 스크롤 위치 알기

이렇게 하면 현재 스크롤의 위치를 알 수 있다.

 

 

 

 

(쓰노틀링 처리를 하지 않으면 많은 양의 값이 출력된다.)

 

 

 

 

 

 

- 전체 스크롤 높이 값 

전체 스크롤 높이 값을 알 수 있다.