# scroll event

7개의 포스트
post-thumbnail

[TIL🔥] Day23(9/8)

오늘은 무한 스크롤 UI를 구현하는 방법에 대해 배웠다. 어려울 것 같다고 생각했는데 바닐라 JS를 반복해서 쓰니 훨씬 빠르고 쉽게 이해할 수 있었다...이게 다 3주간의 고생이 있었기 때문에 가능하다고 생각한다. 프로그래머스 KDT 최고 ><scroll even

2021년 9월 8일
·
0개의 댓글
post-thumbnail

W1 - 기술정리 | Intersection Observer

Intersection Observer API는 target element와 ancestor element 또는 top-level document's viewport 사이의 교차지점(intersection)의 변화를 비동기적으로 관찰(observe)하는 기능을 제공한다

2021년 7월 28일
·
0개의 댓글
post-thumbnail

react 스크롤시 네비게이션 변환

진행하고 있는 빵덕 프로젝트의 테마상세 페이지에서 스크롤시 네비게이션바의 색이 변환하는 디자인이 나왔다. 스크롤 위치를 어떻게확인할까 고민을 하다가 IntersectionObserver를 사용하기로 하였다.1.eEffect안에 IntersectionObserver로 r

2021년 5월 17일
·
0개의 댓글
post-thumbnail

COINSS: React Custom Hooks로 Scroll Event 구현하기

Scroll Event를 Custom Hook으로 빼보는 방법에 대해 공부해보도록 하겠습니다. 일반적인 Scroll Event 일반적으로 Scroll Event를 감지하기 위해서는 addEventListener('scroll')을 이용하면 됩니다. 앞에 스크롤 이벤

2021년 5월 8일
·
3개의 댓글
post-thumbnail

scroll 값으로 opacity 값 비율구하기

대표적으로 애플사이트에서 scroll값을 이용해 다양한 효과를 연출하는 것을 볼 수 있다. ( 멋지다, 이쁘다..) scroll값으로 opacity 값 비율 0~1 까지의 범위를 구하는 법을 알아보도록 하겠습니다.만약 위와 같이 4개의 섹션이 존재하고, section

2021년 2월 22일
·
1개의 댓글
post-thumbnail

TIL#8 React에서 Scroll event 사용하기

React에서 간단한 Scroll event 사용하기

2021년 2월 21일
·
1개의 댓글
post-thumbnail

TIL 89 | dimmed 영역 스크롤 막기

햄버거 버튼을 눌렀을때 사이드에서 네비게이션 모달이 나오는 페이지의 형태는 쉽게 찾아볼 수 있다. 이때 사용성을 위해서 모달창은 스크롤이 가능하지만(화면보다 네비게이션의 높이가 긴 경우), 그 외에 dimmed 영역은 스크롤이나 터치 이벤트가 불가능하게 하는 것이 좋다

2020년 12월 14일
·
0개의 댓글