エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
gsapのScrollTriggerプラグインとlottie-reactを利用したスクロールアニメーションの実装について|nap5
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
gsapのScrollTriggerプラグインとlottie-reactを利用したスクロールアニメーションの実装について|nap5
実装のポイントとしては2点あります。 1つ目はサイズをレスポンシブに調節することです。 emotionのcss... 実装のポイントとしては2点あります。 1つ目はサイズをレスポンシブに調節することです。 emotionのcss文字列内挿でクラス指定できるのがハンディです。 // https://lottiereact.com/hooks/useLottie#params const {goToAndStop, animationContainerRef, View, animationItem} = useLottie( { animationData, loop: false, autoplay: false, className: css` width: 400px; height: 400px; @media (max-width: 768px) { width: 300px; height: 300px; } `, }, {} ); もう一つはScrollTriggerのハンドリングをPCとSP