IntersectionObserver()1 [WEB] 웹페이지에 스크롤 애니메이션 만들기 IntersectionObserver() IntersectionObserver() 사용 요즘 많은 웹 페이지들이 스크롤 애니메이션을 구현하여 조금 더 멋있어(?) 보이는 웹 페이지를 만들고 있다. 이런 웹 페이지는 어떻게 만들 수 있을까? 예전에는 HTML의 높이 요소를 측정하여 scroll EventListener를 사용해 많이 구현을 했지만 요즘에는 다른 방법으로 스크롤 애니메이션을 만든다. new IntersectionObserver()라는 기능을 사용하면 편리하게 사용할 수 있다. 이 기능을 사용하면 현재 HTML 요소가 화면에 보이는지 파악하기 쉬워진다. 우선 애니메이션이 보여질 수 있게 기본적인 세팅부터 해보자. 1번째 2번째 3번째 4번째 5번째 우선, 여기에 글자가 나타나면 투명도를 바꿔주는 기능을 추가해보자. 이 기능을 추가하기.. 2023. 1. 16. 이전 1 다음