애니메이션
Scroll Image Reveal
스크롤 진입 시 clip-path inset가 열리며 내부 이미지는 parallax-scale로 리빌됩니다. IntersectionObserver의 21단계 threshold로 가시 진행도를 연속 측정하여 프레임 개방과 내부 확대를 스크럽하며, 이미지는 외부 URL 없이 그라데이션으로 절차적 합성됩니다.
- 분류
- 애니메이션
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/ScrollImageReveal-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| className | string | undefined | 루트 스크롤 컨테이너에 적용할 CSS 클래스명. |