Toast

JavaScript

アニメーション付きでスタッキングしていくメッセージ通知「Toast」

Toastはアニメーション付きのメッセージ通知を表示することができるjQueryプラグインです。最大の特徴は通知が増えるにつれてスタッキングしていくことです。カスタマイズもできるのが良いですね。

Toast

デモ

デモではボタンをクリックする度にフェードアニメーションでメッセージが次々に表示されていきます。どんどんスタックされていくのがおもしろいですね。

綺麗に整列されるのでとても見やすいです。通知内の右上にあるバツ印をクリックするとメッセージが消えていきます。

さりげない自然な感じのアニメーションが良いですね。

ちなみにアニメーションエフェクトはフェードの他にもスライドとプレーンなタイプが用意されています。

というわけで、スタッキングしていくメッセージ通知機能を実装することができるjQueryプラグイン「Toast」のご紹介でした。

関連記事

  1. Animate Plus

    JavaScript

    CSS、SVGを使った多彩なアニメーションを実装できる「Animate Plus」

    Animate PlusはCSS、SVGを使った多彩なアニメーションを…

  2. JavaScript

    リストなど複数の要素をランダムにフェードで表示していくjQueryプラグイン「champagne.j…

    どこかで使う機会がありそうな感じのjQueryプラグイン「champa…

  3. Inspiration for Menu Hover Effects
  4. vallenato.js

    JavaScript

    シンプルで実装も簡単なjQueryアコーディオン「vallenato.js」

    vallenato.jsは、シンプルで簡単に実装することができるjQu…

  5. Simple Lightbox
  6. Jquery progress indicator on page scroll

最近の記事

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

Facebookページ

PAGE TOP