SweetAlert2

JavaScript

カスタマイズ性が高くアクセシビリティ(WAI ARIA)に優れたアラート実装「SweetAlert2」

SweetAlert2は、レスポンシブ対応でカスタマイズ性が高くアクセシビリティ(WAI ARIA)に優れたアラートを実装することができます。エラーメッセージなどを、オシャレなアニメーション付きで表示したい人に最適です。

SweetAlert2

デモ

SweetAlert2を使っていないノーマルアラートと、SweetAlert2を使ったアラートの動作を比較してみると、その違いは一目瞭然です。SweetAlert2を使ったアラートでは、バウンスがついたアニメーションによる表示がとてもいい感じです。背景にはオーバーレイもかかります。

また、デモページにはさまざまなタイプのサンプルを見ることができます。タイトルとメッセージがついたもの、アラートが表示されてから2秒後に自動で非表示になるもの、jQuery・HTMLでカスタマイズしたものなど、たくさんのサンプルがあります。

メッセージとともに表示するアイコンもいくつかの種類が用意されていて、success、error、warning、info、questionといったものがあります。

また、セッティング可能なパラメーターの数もかなり豊富で、タイトルやテキストをはじめ、モーダルウィンドウの幅、余白、背景、タイマー、アニメーションなど、自分好みにカスタマイズして使いたい人にはピッタリの仕様といえます。

というわけで、優れたカスタマイズ性やアクセシビリティを備えたレスポンシブ対応のアラートを実装したい人は、ぜひ「SweetAlert2」をチェックしてみてください。

SweetAlert2

HR Navigation Responsive MenuWebアプリケーションに最適なレスポンシブ対応メニュー「HR Navigation Responsive Menu」前のページ

タブやアコーディオンを実装できるjQueryプラグイン「jpix」次のページno-image

関連記事

  1. Schedule Template

    JavaScript

    シンプルなスケジュール表を実装する「Schedule Template」

    スッキリしたデザインのシンプルなスケジュールテンプレートを実装するため…

  2. jumboShare

    JavaScript

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

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

  3. waslidemenu
  4. floatThead

    JavaScript

    テーブルのヘッダーを固定できるjQueryプラグイン「floatThead」

    floatTheadはテーブルのヘッダーを固定することができるjQue…

  5. Sidr

    JavaScript

    横からサイドメニューが現れるjQueryプラグイン「Sidr」

    面白いjQueryプラグインがあったのでメモがてらご紹介します。Sid…

  6. jQuery-TimelineMe

    JavaScript

    シンプルなタイムラインを簡単につくれる「jQuery-TimelineMe」

    jQuery-TimelineMeは、タイムラインを簡単に構築すること…

最近の記事

  1. 冬用のふとん
  2. 田沢湖
  3. ゴムの耳栓
  4. ライオンコーヒー(バニラマカダミア)
PAGE TOP