https://coolcssanimation.com/how-to-trigger-a-css-animation-on-scroll/
How to trigger a CSS animation on scroll
How to trigger a CSS animation on scrollby Nick Ciliak on March 27, 2021 This is a step-by-step tutorial for how to create a CSS animation and trigger it on scroll using the Intersection Observer API. If you're new to Intersection Observer, don't let it sc
coolcssanimation.com
결론은 CSS 만으로 불가능ㅋ
글 제목만 봤을 땐 CSS로 스크롤 애니메이션을 만들 수 있다는 줄 알았는데 읽다 보니 Intersection Observer API를 쓰라는 설명이 나온다.
그래도 최초 1회 스크롤 내릴 때뿐만 아니라 계속 특정 위치에 스크롤이 이동할 때 실행되는 애니메이션이 좋아 속은 것 같긴 하지만 굳이 jquery, javascript를 복잡하게 쓰지 않아도 좋으니 분명히 동적 애니메이션에 약하다면 한번 참고해볼 만하다고 생각된다.
'메모 > IT' 카테고리의 다른 글
| 네이버 커머스의 현재와 미래 (0) | 2021.05.08 |
|---|---|
| 원소주기율포 형식의 웹사이트 (0) | 2021.05.08 |
| 폰트 사이즈에 대한 이해 (0) | 2021.05.08 |
| css로 입체형 버튼 표현하기 (0) | 2021.05.08 |
| 🗒상품 리뷰 설계 참고 (0) | 2021.04.16 |