jquery.confirmDialog

JavaScript

フルスクリーンによるダイアログボックスを表示できる「jquery.confirmDialog」

jquery.confirmDialogは、フルスクリーンによるかっこいいダイアログボックスを表示させることができます。トリガーされると、画面上部からスライドダウンでダイアログボックスが降りてきます。フルスクリーンなのでとてもダイナミックですね。

jquery.confirmDialog

jquery.confirmDialog

デモページでは、「DEMO」と書かれたボタンが設置されており、これをクリックすると上からダイアログボックスがスライドダウンで表示されます。

フルスクリーン(背景にはオーバーレイがかかります)で表示されるダイアログボックスは、選択する時に集中しやすくなるのでとてもいい感じですね。

ちなみに、デモではダイアログボックスを表示したあと「YES」か「CANCEL」を選択するようになっています。

また、オプションを用いたセッティングも可能です。主なオプション項目は、attachAfter、title、accept、refuse、acceptStyle、refuseStyle、acceptActionです。

ダイアログボックスに表示させたいテキストは「title」に指定すればOKです。2つの選択ボタン(YES or NO)に表示させるテキストも、「accept」と「refuse」から指定できます。YES側が「accept」、NO側が「refuse」です。さらに、ボタンのスタイルも「acceptStyle」と「refuseStyle」から変更可能です。

シンプルながらもオプションによる細かいセッティングもできるので、自分好みのかっこいいフルスクリーンによるダイアログボックスを実装したい方は、ぜひチェックしてみてください。

関連記事

  1. no-image

    JavaScript

    シンプルなドロップダウンメニューを実装できるjQueryプラグイン「snakeMenu」

    snakeMenuはシンプルなアニメーションによるドロップダウンメニュ…

  2. Ideal Image Slider

    JavaScript

    シンプルで動きが滑らかなスライダー「Ideal Image Slider」

    Ideal Image Sliderはレスポンシブに対応したシンプルで…

  3. Philter

    JavaScript

    CSSのフィルターをコントロールできるjQueryプラグイン「Philter」

    PhilterはCSSのフィルターを簡単にコントロールすることができる…

  4. Quttons

    JavaScript

    ボタンの形状やカラーが変化するjQueryプラグイン「Quttons」

    Quttonsはボタンをクリックすると形状やカラーが変化して新しいコン…

  5. JQuery Clock

    JavaScript

    シンプルなアナログ時計を実装できる「JQuery Clock」

    JQuery Clockはシンプルなアナログ時計を実装できます。画像を…

  6. no-image

    JavaScript

    ダイナミックに回転してコンテンツが切り替わる「Page Scroll 3D」

    Page Scroll 3Dは、クルッとダイナミックに回転してコンテン…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP