UI컴포넌트 - 3.Scroll spy / 4. Scroll top

Wendy·2021년 5월 8일
0

[강의] 시크릿코드

목록 보기
3/3

시크릿 코드: 프론트엔드 UI 컴포넌트 편 - 패스트캠퍼스

3.Scroll spy

ScrollIntoView

throttle/debounce
bind/call/apply

Q. IntersectionObserver의 isVisible은 왜 항상 false?
A. IntersectionObserver v2에서 사용할 수 있다

Q. IE11 에서 IntersectionObserver 안돼? 우리 사이트는?
A. 다른분이 이미 폴리필 적용해주셨다^^

학습 후기

기본동작
resize 이벤트 추가
throttle/debounce
IntersectionObserver(JS, React)

한 단계 씩 더 좋은 방법을 배울수 있었고
지난시간에 배운것들을 한번 더 연습 할 수 있던것도 좋았다.

또 강사님이 클로저를 여러번 보여주셔서
클로저는 도대체 언제쓰는거야? 하는 물음이 아주 잘 해결이 됐다 ㅎㅎㅎ

4. Scroll top

브라우저별로 가져올수 있는 속성이 다름

window.scrollY
window.pageYOffset
document.documentElement.scrollTop
document.body.scrollTop

window.addEventListener('wheel', fn); //e.wheelDelta
window.addEventListener('DOMMouseScroll', fn); //e.detail

scroll 이벤트를 확인하는 여러가지 방식

window.addEventListener('scroll', fn)
window.onscroll

profile
개발 공부중!

0개의 댓글