no-image

JavaScript

シンプルで軽量なスクロールアニメーション実装「animateMePlz」

animateMePlzはシンプルで軽量なスクロールアニメーションを実装できるjQueryプラグインです。0.8KBと超軽量ながらもカスタマイズもできる仕様がうれしいですね。使い方も簡単なので手軽に実装できるはず。

animateMePlz

デモ

デモページでは下へスクロールしていくと、各セクションごとにセクションの背景の色が変化します。緑、青、オレンジ……など、スクロールしていくことでいろんな色に切り替わっていく様子がおもしろいですね。スクロールに合わせて、このように何かのアニメーションを加えたい場合にはピッタリのjQueryプラグインといえます。

また、オプションには、threshold、animationStyle、repeat、animationDelayといった項目が用意されています。各オプションのデフォルト値は、thresholdが20、animationStyleが’fadeIn’、repeatが’repeat’、animationDelayが’.25s’です。

ちなみにanimationStyleはanimate.cssを利用できるので、かなり豊富なアニメーションの種類の中から選べます。

animateMePlz

no-image水平スクロールができることを示唆してくれる「ScrollHint」前のページ

レスポンシブ対応のjQuery Lightbox & Popupプラグイン「Flashy」次のページno-image

関連記事

  1. Enllax.js

    JavaScript

    軽量で簡単なパララックスを実装できるjQueryプラグイン「Enllax.js」

    Enllax.jsは軽量で使い方も簡単なパララックスエフェクトを実装す…

  2. JavaScript

    文字の半分をスタイルすることができるjQueryプラグイン「Splitchar」

    SplitcharというjQueryプラグインを使えば、文字の半分をス…

  3. Pogo Slider

    JavaScript

    豊富なスライドアニメーションが揃っているjQueryプラグイン「Pogo Slider」

    Pogo Sliderは豊富なスライドアニメーションが揃っているjQu…

  4. Coin Slider

    JavaScript

    ユニークなエフェクトを実装できるjQueryイメージスライダー「Coin Slider」

    ユニークなエフェクトで画像がスライドしていくjQueryイメージスライ…

  5. overhang.jp

    JavaScript

    シンプルでクールな通知バーを実装できるjQueryプラグイン「overhang.jp」

    overhang.jsは、通知バーを実装するためのjQueryプラグイ…

最近の記事

  1. SRS-XB43
  2. Nu:kin
  3. フィールグッドシャワー

アーカイブ

PAGE TOP