Sal.js

JavaScript

Vanilla JSによる軽量のスクロールアニメーションライブラリ「Sal.js」

Sal.jsは軽量のスクロールアニメーションを実装できるライブラリです。Vanilla JSが使われていてjQueryなどへの依存性もありません。オプションやアニメーションの種類もいくつか用意されているのでカスタマイズしたい人にも使いやすそうですね。

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が用意されています。

Sal.js

Foodie料理や日常をオシャレに撮影できるiPhoneカメラアプリ「Foodie」前のページ

アクセシブルなビフォーアフター画像を実装できる「BeerSlider」次のページno-image

関連記事

  1. iconate.js

    JavaScript

    アイコンをオシャレにアニメーションしながらtransformさせる「iconate.js」

    iconate.jsはアイコンをアニメーションさせながら別のアイコンへ…

  2. JavaScript

    シンプルでスワイプにも対応したスライダーならSimple jQuery sliderがオススメ

    シンプルでスマホのスワイプにも対応したスライダーを実装したいって時にオ…

  3. Protip

    JavaScript

    カスタマイズ性抜群のツールチップを実装できる「Protip」

    Protipはカスタマイズ性が抜群のツールチップを実装することができる…

  4. ClickSpark.js

    JavaScript

    美しいパーティクルエフェクトを実装できる「ClickSpark.js」

    ClickSpark.jsは画像を用いたたくさんの粒子が放出されるよう…

  5. Yet Another Ripple Plugin
  6. scrollMonitor

    JavaScript

    要素が表示領域に入ったり出たりするとイベントを受け取れる「scrollMonitor」

    scrollMonitorは、要素が表示領域(ビューポート)に入ったり…

最近の記事

  1. WiMAX
  2. 甘柿
  3. 冬用のふとん
PAGE TOP