モーダルウィンドウを表示する際に
遠近感を加えて分かりやすくする、
というコンセプトの元、作られた
スクリプト・Avgrundのご紹介です。
思いつきませんでしたが、結構いい
ですね、これ。
遠近感のあるモーダルウィンドウを実装する非依存型のスクリプトです。これはいいエフェクト。説明するより見たほうが早そうですね。
Sample
以下動作サンプル。ボタンを押せばモーダルウィンドウが表示されます。
確認出来ましたでしょうか。
コード
<script type="text/javascript" src="avgrund.js"></script>
avgrund.jsを読み込む。あとはマークアップです。
<button onclick="avgrund.activate();">クリック!</button>
avgrund.activate()
をclickさせればイベントが発火します。
<aside class="avgrund-popup"> <p> hogehoge </p> <button onclick="avgrund.deactivate();">Close</button> </aside>
class="avgrund-popup"
がモーダルウィンドウとして呼び出されます。
簡単に使えるのがいいですね。スマフォでも動くか見てないので後で見てみます。ライセンスはMIT。