iziModal.js - 本当に動的なモーダルウィンドウjQueryプラグイン

ほとんどのモーダルウィンドウは 気を散らすと訪問者を悩ます と オプトインフィールド そして 不要な取引. これらのモーダルはしばしばページ全体を引き継ぎ、ひどく見え、そしてウィンドウを閉じるための明確な方法を提供しません。ありがたいことに, iziModal.js 正反対です.

これは私が今まで見た中で最も穏やかなモーダルウィンドウプラグインの1つであり、モーダルとやり取りすることに興奮しています。.

iziModal.jsは jQueryプラグイン だからあなたは必要ですか jQueryライブラリのコピー これが機能するために。しかし、それは かなり軽量 そしてあなたもできます ライブラリを外部に含める CDNJSから.

このプラグインは付属しています たくさん さまざまなオプションの. あなたはにオプションを渡すことができます モーダルサイズ、フレームタイプ、およびアニメーションのスタイルを設定する. でもできます コールバック関数を作成する ユーザーがモーダルを閉じるか、特定の要素をクリックした場合.

発見できる たくさんの例 CodePenでは、私は本当に好きです iziModalのホームページでホストされているデモ. 具体的には、 iframe埋め込みオプション それがあるところ 自動再生Vimeoプレーヤー モーダルに並んでいる.

デザインは素晴らしいです、そしてモーダルは本当にそれがそうであるように感じます インターフェースの一部. アニメーションの質もまた印象的です、そしてそれはすべてを搭載しています CSS3とjQuery.

メインプラグインページには、また見つけることができます コードスニペットのあるドキュメンテーションテーブル 利用可能な各デモ用。これが 最短コード モーダルウィンドウのポップアップに使用する.

 $（document）.on（ 'クリック'、 '。トリガー'、関数（イベント）event.preventDefault（）; $（ '＃modal'）.iziModal（ 'open'）;）; 

の iziModal（） 機能は持っています 45以上の異なるオプション に渡すことができます モーダルウィンドウをカスタマイズする. それはまた持っています カスタムイベント ができる トリガー機能 モーダルが開いたり、閉じたり、フルスクリーンになったりするときのように.

これは信じられないほど大規模なプロジェクトで、簡単に私のお気に入りのモーダルウィンドウプラグインの1つです。 デザインとユーザビリティの観点.

ソースのコピーを入手するには、 NPMを通してそれを引っ張る または GitHubからダウンロード. プラグインについての提案がある場合、または単にあなたの感謝を共有したい場合は、作成者Marcelo Dolce @marcelodolceをツイートすることができます。.