Sal.jsは軽量のスクロールアニメーションを実装できるライブラリです。Vanilla JSが使われていてjQueryなどへの依存性もありません。オプションやアニメーションの種類もいくつか用意されているのでカスタマイズしたい人にも使いやすそうですね。
Sal.js
以下のページからSal.jsの実際のデモ動作をチェックできます。
デモでは四角形や星形や六角形などいろんな図形がスクロールとともにアニメーション表示されます。スクロールアニメーションがあることでスクロールするのが楽しくなりますね。
サポートしているアニメーションは下記のとおりです。
- fade
- slide-up
- slide-down
- slide-left
- slide-right
- zoom-in
- zoom-out
- flip-up
- flip-down
- flip-left
- flip-right
また、data属性には、data-sal-duration、data-sal-delay、data-sal-easingが用意されています。
そのほか、threshoID、once、disableといったオプションなどもあるので気になる人はぜひチェックしてみてください。ライセンスはMITとのこと。Sal.jsの具体的な実装方法やダウンロードは以下のページからどうぞ。