必要なCSSアニメーションを選んで、あなたのプロジェクトですぐに使えます。色やサイズ、速度などをカスタマイズしてコードをコピーするだけです。
ウェブサイトやアプリケーションのコンテンツが読み込まれるまでの間に表示されるアニメーションのことです。主にCSS(カスケーディングスタイルシート)技術を用いて作成され、軽量でありながら多彩な表現が可能です。ユーザーに読み込み中であることを視覚的に伝え、待ち時間のストレスを軽減する効果があります。
ローディングアニメーションは、サイトのコンテンツやデザインとの調和が重要です。シンプルで洗練されたデザインから、ユニークで遊び心のあるものまで、目的に合わせて選びましょう。また、アニメーションが複雑すぎたり、表示時間が長すぎたりすると逆効果になることもあるため、ユーザーが快適に感じるバランスを考慮することが大切です。当ライブラリでは、様々な種類のアニメーションを提供しており、それぞれのカスタマイズオプションも豊富に用意していますので、ぜひ色々試して、あなたのプロジェクトに最適なローダーを見つけてください。
HTML
」タブと「CSS
」タブ(必要であれば「JS
」タブも)を確認し、表示されているコードを把握します。CSS
)のコードをクリップボードにコピーします。CSS
コードを、あなたのプロジェクトのCSSファイルに貼り付けます。HTML
」タブに切り替えて、表示されているHTML構造をコピーし、あなたのウェブページのローディングを表示させたい箇所に貼り付けます。JS
」タブが存在し、コードが表示されている場合は、そのJavaScriptコードもコピーして、あなたのプロジェクトの適切なJavaScriptファイルに記述、またはHTML内の適切な箇所に<script>
タグを使用して配置します。各アニメーションカードの右上にあるハートアイコンをクリックすると、お気に入りに追加できます。「お気に入り」タブで、選択したアニメーションだけをまとめて見ることも可能です。