Yet Another Ripple Plugin

JavaScript

クリック時に波紋のようなアニメーションエフェクトを実装できるjQueryプラグイン「Yet Another Ripple Plugin」

Yet Another Ripple Pluginは、クリックした時に波紋のようなアニメーションエフェクトを表示させることができるjQueryプラグインです。アニメーションがあることで、ボタンがしっかり押されたことが確認できる上に、何より見た目がとてもオシャレになりますね。

Yet Another Ripple Plugin

デモ

設置されているボタンをクリックすると、そのカーソルの位置を中心に左右へ波紋のようなアニメーションエフェクトが広がっていきます。シンプルですが、さりげない波紋効果がとてもいいアクセントになっていますね。

波紋のカラーやアニメーションの時間は、オプションから調節することもできます。具体的に、カラーは「colors」、アニメーション時間は「duration」から好きな値を指定可能です。

波紋アニメーションをサラッとさりげなく見せたい場合は時間を速めに、一方で優雅な雰囲気を出したい場合には時間を遅めに設定するとよさそうですね。

ちなみに、Yet Another Ripple Pluginは、Googleマテリアルデザインからインスパイアされたとのこと。

ボタンをクリックした時に波紋のようなかっこいいアニメーションエフェクトを実装したいという人は、ぜひ「Yet Another Ripple Plugin」を活用されてみてはいかがでしょうか?

Yet Another Ripple Plugin

関連記事

  1. jumboShare

    JavaScript

    SNSシェアボタンとジャンボサイズのカウンターを設置できる「jumboShare」

    jumboShareはSNSのシェアボタンとジャンボサイズのカウンター…

  2. chalk-animation

    JavaScript

    カラフルなアニメーションを実装できる「chalk-animation」

    chalk-animationはカラフルなアニメーションによるテキスト…

  3. Animated Toggle Menu
  4. JUMBLE

    JavaScript

    テキストの色をカラフルにシャッフルさせるjQueryプラグイン「JUMBLE」

    JUMBLEというjQueryプラグインを使えば、指定したテキストの色…

  5. Simple Easy Slider

    JavaScript

    美しいフェードスライダーを実装できるjQueryプラグイン「Simple Easy Slider」

    Simple Easy Sliderは美しいフェードアニメーションによ…

  6. 2013年上半期jQueryプラグインまとめ

    JavaScript

    当ブログで紹介したjQueryプラグイン19選のまとめ 2012/04 – 2012/0…

    2012年4月〜2012月7月までの当ブログで紹介したjQueryプラ…

最近の記事

  1. Anker PowerPort Atom PD 4
  2. USB-2H401BKN
  3. Dyson Pure Cool Me
  4. ルック セレクション

アーカイブ

PAGE TOP