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. BeefUp

    JavaScript

    多彩なカスタマイズができるjQueryアコーディオンプラグイン「BeefUp」

    BeefUpは多彩なカスタマイズができるレスポンシブに対応したjQue…

  2. Bara-Bones-Slider

    JavaScript

    優れたカスタマイズ性を有するjQueryスライダー「Bara-Bones-Slider」

    Bara-Bones-Sliderは、優れたカスタマイズ性を有するイメ…

  3. Expandy Menu

    JavaScript

    マウスオーバーで広がるメニューパネル「Expandy Menu」

    Expandy Menuはマウスオーバーすると横に広がるメニューパネル…

  4. WEB TICKER

    JavaScript

    テキストや画像を無限にスクロールさせれるティッカー実装「WEB TICKER」

    WEB TICKERは、テキストや画像、リストなどさまざまなコンテンツ…

  5. Text Scramble Effect

    JavaScript

    テキストをスクランブルしながら表示していく「Text Scramble Effect」

    Text Scramble Effectはテキストをカシャカシャとスク…

  6. SweetDropdown

    JavaScript

    スタイリッシュで多彩なドロップダウンを実装できる「SweetDropdown」

    SweetDropdownは、多彩なドロップダウンを実装することができ…

最近の記事

  1. 甘柿
  2. 冬用のふとん
  3. 田沢湖
PAGE TOP