エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
【JavaScript】ビューポートに入った要素をアニメーション表示する[Animon]の使い方
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
【JavaScript】ビューポートに入った要素をアニメーション表示する[Animon]の使い方
ブラウザのビューポートに要素が入ったことを検知して、アニメーションで表示させるJavaScriptライブラ... ブラウザのビューポートに要素が入ったことを検知して、アニメーションで表示させるJavaScriptライブラリ[Animon]の使い方を紹介します。 JavaScriptファイルの容量はなんと「0.75kB」と超軽量。 仕組みは、Googleも推奨している Intersection Observer を利用してDOM要素を監視して、あらかじめ設定されたclass名を付与することでアニメーションを実現しています。 jQueryなど他のライブラリに依存せず、単体で動作するのも嬉しいポイントです。 Animon: https://bnthor.github.io/animon-site/ 導入方法は以下より。 [Animon]の導入には2つのファイルが必要です。GitHubからダウンロード可能ですが、CDNでも提供されているので、今回はこちらを利用しましょう。 [Animon]のファイル一式を読み