Raindrops.js

JavaScript

水面に雨粒が落ちてくるエフェクトが素敵なjQueryプラグイン「Raindrops.js」

Raindrops.jsは水面に雨粒が落ちてくる素敵なエフェクトを実装することができるjQueryプラグインです。雨粒が落ちることにより、水面がユラユラと揺れるのがとてもリアルでおもしろいですね。

Raindrops.js

Raindrops.js

デモではいくつかのエフェクトのパターンを見ることができます。小刻みにポタポタ落ちてくるものからユッタリと落ち着いた感じで落ちてくるものまで様々です。

オプションが割と豊富なので、これらの設定を変更することでいろんなパターンに調整することができます。

こんな感じで基本的な使い方はとても簡単です。

jQuery('#sample').raindrops();

color、waveLength、waveHeight、density、rippleSpeedなどなどカスタマイズする上でとても役立つオプションがいろいろ揃っています。

というわけで、水面に雨粒を落とすエフェクトを実装したい方は、ぜひ試してみてはいかがですか?

関連記事

  1. Nex

    JavaScript

    ダイナミックで美しいフルスクリーンのjQueryスライダーを実装できる「Nex」

    Nexはダイナミックで様々なアニメーションエフェクトが用意されたフルス…

  2. Sliding Panels Template
  3. SweetAlert
  4. Navi.js

    JavaScript

    ナビゲーションとコンテンツが連動して切り替わるjQueryプラグイン「Navi.js」

    ナビゲーションとコンテンツが連動して切り替わる便利なjQueryプラグ…

  5. jsPanel

    JavaScript

    高度なセッティングができるフローティングパネルやモーダルウィンドウ実装「jsPanel」

    jsPanelは高度なセッティングができるフローティングパネル、モーダ…

  6. fineScroll bar

    JavaScript

    簡単に使えるスクロールバー実装「fineScroll bar」

    fineScroll barは簡単に使えるスクロールバーを実装できるj…

最近の記事

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

アーカイブ

PAGE TOP