Audero Smoke Effect

JavaScript

スモーク(煙)のエフェクトを実装できるjQueryプラグイン「Audero Smoke Effect」

スモーク(煙)のエフェクトを実装することができるjQueryプラグイン「Audero Smoke Effect」が面白かったのでご紹介します。スモークが「モクッ」と現れて「フワッ」と上昇しながら消えていく珍しいエフェクトです。湯気と煙の2パターンがあるので、こういった雰囲気を伝えたい時なんかに役立ちそうですね。ということで以下は使い方です。

[ads_center]

使い方

jQueryとプラグインを読み込みます。

<script src="jquery.js"></script>
<script src="jquery.auderoSmokeEffect.js"></script>

スモークを出す物の画像を記述します。

<img id="sample" src="images/sample.png" />

あとはプラグインをセットするだけです。

$(window).load(function() {
    $("#sample").auderoSmokeEffect({
        imagePath: "images/smoke.png"
    });
});

オプションも色々と用意されているので、詳しい使い方やダウンロードに関しては以下からどうぞ。

関連記事

  1. Random Text Shuffle

    JavaScript

    シャッフルしながらテキストが表示される「Random Text Shuffle」

    Random Text Shuffleは文字をシャッフルしながらテキス…

  2. Ladda

    JavaScript

    ボタンとローディングアイコンが一緒になったUIを実装できるjQueryプラグイン「Ladda」

    Laddaはボタンとローディングアイコンが一緒になったUIを実装するこ…

  3. Animated Intro With jQuery

    JavaScript

    プログレスバーつきのカッコいいイントロページを実装する「Animated Intro With jQ…

    シンプルなアニメーションがとてもカッコいいイントロページを実装する「A…

  4. linkunderline

    JavaScript

    テキストリンクにアンダーラインのアニメーションを実装できる「linkunderline」

    linkunderlineは、テキストリンクにアンダーラインを引くアニ…

  5. Flex-box Gallery

    JavaScript

    ランダムサイズの画像をかっこいいギャラリーにしてくれる「Flex-box Gallery」

    Flex-box Galleryは、ランダムサイズによる画像たちをかっ…

  6. ScrollPress

    JavaScript

    スムーズなアニメーションのスクロールトップ実装「ScrollPress」

    ScrollPressは、スムーズなアニメーションによるスクロールトッ…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. macOS Mojaveのダークモード
  2. Olli
  3. 単語帳メーカー(Flashcard Maker App)
  4. 1Password 7

Facebookページ

PAGE TOP