スクロールに応じて要素をCSS3で手軽にアニメーションさせられるライブラリ・「Kissui.scrollanim」

Ads

Kissui.scrollanim

Kissui.scrollanimはスクロールに応じて要素をアニメーションしながら表示させるためのライブラリです。オシャレ感ただようWebページに大抵あるあのエフェクトを手軽に付与しよう、というもの。個人的にはどこもかしこも導入していてそろそろ食傷気味ですが、いまだクライアントさんから指示頂いたりと需要があるようですのでメモ。エフェクトは概ねCSS3のkeyframesで行われていて、ライブラリはその導入サポートをするためのものになります。要素が表示されたらカスタムデータ属性で指定されたエフェクト名に必要なclassを付与、動作終了したら削除する、という感じみたいです。エフェクトの追加やinfinite化も可能みたいですが、基本的にはCSSメインなのでJavaScript自体は軽量で済むようです。ライセンスはMIT。

Kissui.scrollanim

タイトルとURLをコピーしました