Flurry

JavaScript

Webページに雪を美しく降らせる冬にピッタリのjQueryプラグイン「Flurry」

FlurryはWebページに雪を美しく降らせてくれるアニメーションを実装することができるjQueryプラグインです。多彩なオプションも用意されているので、カスタマイズ性にも優れています。

雪のユニコード文字を使って実装できる

Flurry

デモでは画面内に雪が降ってくるアニメーションを確認できます。しんしんとゆっくり降り注いでくる雪は、冬にはピッタリのエフェクトですね。

また、画像やCSSファイルに依存することなく雪のユニコード文字を使って実装できるのもうれしいポイントの一つです。

雪が降ってくるときには雪がDOMに追加され、雪が消えていくときに削減されます。雪が多すぎるとパフォーマンスに影響を与える可能性があるので、そのあたりに気をつけたいところです。

オプションには、character、color、height、frequency、speed、small、large、wind、windVariance、rotation、rotationVarianceなど、たくさんの項目が用意されているので、自分好みにカスタマイズしてFlurryを実装したい人にはピッタリです。

使い方もシンプルでわかりやすいことから、気軽に実装できるのではないでしょうか?

また、ブラウザはChrome 54、Firefox 49、IE 11、Edge 38でテスト済みとのこと。

Webページ内に雪を降らせてくれるアニメーションで、冬のイメージをグッと高めたいという人は、ぜひFlurryを活用してみてください。

elmenuレスポンシブ対応で軽量なハンバーガーメニューを実装できる「elmenu」前のページ

動きがオシャレなアニメーションのサイドナビゲーション「AnimatedSideNav」次のページAnimatedSlideNav

関連記事

  1. TabbedContent
  2. simpleSlideShow

    JavaScript

    カスタマイズしやすいシンプル・軽量なスライドショー「simpleSlideShow」

    simpleSlideShowは、シンプルで軽量なスライドショーを実装…

  3. Cube-jQuery-Slider

    JavaScript

    3Dキューブなスライダーを実装できる「Cube-jQuery-Slider」

    Cube-jQuery-Sliderは、3Dキューブなスライダーを実装…

  4. ToProgress

    JavaScript

    画面上部に軽量なプログレスバーを実装できる「ToProgress」

    ToProgressは画面上部にシンプルで軽量なプログレスバーを実装で…

  5. evol-colorpicker

    JavaScript

    マイクロソフト オフィス2010のようなカラーピッカー「evol-colorpicker」

    evol-colorpickerは、マイクロソフト オフィス2010の…

  6. cubeTransition.js

    JavaScript

    3Dキューブのようなスライダーを実装できる「cubeTransition.js」

    cubeTransition.jsは、CSS 3DトランスフォームとC…

最近の記事

  1. 200-DGBG020
  2. Anker PowerPort 5-in-1 37.5W Hub
  3. α7C + FE28-60mm F4-5.6
  4. Apple Watch Series 6

アーカイブ

PAGE TOP