[JavaScript] 자바스크립트 스크롤 이벤트 처리하기

116_자바스크립트 스크롤 이벤트 처리하기

[적용]

• 스크롤 분량에 따라 요소의 표시를 지연시키고 싶을 때

---

[문법]

이벤트	발생 타이밍
scroll	대상 요소의 스크롤 작업

---

[내용]

scroll 이벤트는 대상 요소의 스크롤 작업 실행 시 발생하며, 주로 wondow 객체에서 사용된다.

세로는 window.scrollY, 가로는 window.scrollX로 확인 가능하며,

스크롤 분량에 따라 처리를 구분하고 싶을 때 유용하다.

// 스크롤 시 문구와 함께 좌표가 출력
window.addEventListener('scroll', () => {
	console.log('스크롤 작업', window.scrollX, window.scrollY);
});

 

---

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김