scroll-reveal-libraries

This skill covers AOS (Animate On Scroll), a lightweight CSS-driven library for scroll-triggered animations. AOS excels at simple fade, slide, and zoom effects activated when elements enter the viewport.

Problem: AOS doesn't detect elements on first render or route changes.

Solution: Initialize in useEffect and refresh on route/content changes:

AOS (Animate On Scroll) を使用した、シンプルなスクロールトリガーのリビールアニメーション。このスキルは、複雑なアニメーション オーケストレーションを使用せずに、基本的なフェード/スライド エフェクトを必要とするマーケティング ページ、ランディング ページ、またはコンテンツの多いサイトを構築するときに使用します。スクロール アニメーション、スクロール トリガーによるリビール、AOS、単純なアニメーション、または基本的なスクロール効果を含むタスクをトリガーします。より単純な使用例向けの GSAP ScrollTrigger および Locomotive Scroll の代替品。 React 固有のアニメーションについては motion-framer と比較してください。 ソース: freshtechbro/claudedesignskills。