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のダウンロードや詳しい使い方に関しては、以下のページからどうぞ。