AOS

JavaScript

スクロールに合わせていろんなアニメーションで表示できる「AOS」

AOSはスクロールに合わせてフェードやフリップ、ズームなどのアニメーションを加えて表示させることができる軽量のライブラリです。スクロールしたときに要素が動くので、注目度もアップしそうですね。アニメーションも滑らかでとても素敵です。

AOS

デモ

下へスクロールしていくと、フェード、フリップ、ズーム、またはそれらを組み合わせたものなど、多彩なバリエーションが用意されています。

  • fade-up
  • fade-down
  • fade-left
  • fade-right
  • fade-up-right
  • fade-up-left
  • fade-down-right
  • fade-down-left

フリップ、スライド、ズームなどにもいろんな種類が用意されているので、自分好みのアニメーションが見つかりやすいと思います。

どれもシンプルで違和感のないアニメーションなので、いろんなサイトで活用できるのではないでしょうか? 使い方がカンタンなところもいいですね。

というわけで、スクロールに合わせて指定した要素をアニメーション表示できる「AOS」のご紹介でした。

AOS

関連記事

  1. Maximum Characters limit exceeded warning
  2. NavSync

    JavaScript

    ナビゲーションとコンテンツが連動するjQueryプラグイン「NavSync」

    NavSyncはナビゲーションとコンテンツが連動してアニメーションする…

  3. Jqx-Media-Slider
  4. Circular Slider
  5. Slight Submenu
  6. jQuery Tooltip Basic

    JavaScript

    カスタマイズしやすいツールチップ実装「jQuery Tooltip Basic」

    jQuery Tooltip Basicは、カスタマイズしやすいツール…

最近の記事

  1. 田沢湖
  2. ハクバ シリコンクロス
  3. トライポッドスリーブ
  4. レンズペン3 ミニプロとレンズペン ELITE マイクロプロ

Instagram始めました

Facebookページ

PAGE TOP