レスポンシブWebデザインに対応したモーダルウィンドウを実装するjQueryプラグイン・Remodal
RWD対応のモーダルウィンドウを実装するスクリプト、Remodalのご紹介です。jQueryに依存しています。 RWDなWebサイトで使えるモーダルウィンドウ実装スクリプトです。 デバイスのモニタサイズに応じて適切なレイアウトを維持するモーダルウィンドウです。 スマフォの場合は全画面に表示されるのでフィンガーフレンドリーを考慮した設計と言えそうです。 <script src="http:////ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="jquery.remodal.min.js"></script>本体とスクリプトを読み込みます。 <div class="remodal" data-remodal-id="modal" data-remodal-options='{ "
モーダルウインドウを様々なエフェクトで表示するjQueryプラグイン | Web活メモ帳
↑このようなモーダルウインドウを様々なエフェクトで表示させる事が出来ます。 デモはこちら ※デモの中にある画像の「more」を押すとモーダルウインドウが表示してください。 スマホ対応もされているとのこと。興味のある方はデモをご覧ください。
動画やGoogleマップにも対応した軽量なモーダルウィンドウを実装するjQueryプラグイン・Pop Easy - かちびと.net
使いやすそうなモーダルウィンドウのスクリプトがあったので備忘録。VimeoやGoogleマップにも対応しており、ファイル自体も圧縮版で2KB程度と軽量なのも嬉しいですね。 モーダルウィンドウ実装用のスクリプトです。jQueryに依存します。 使いやすそうなモーダルウィンドウです。 スタイルもカスタマイズしやすそう。 $('.modalLink').modal({ trigger: '.modalLink', olay:'div.overlay', modals:'div.modal', animationEffect: 'slidedown', animationSpeed: 400, moveModalSpeed: 'slow', background: '00c2ff', opacity: 0.8, openOnLoad: false, docClose: true, closeByE
Simple jQuery Modal Window Tutorial
Introduction In this tutorial, I'm going to share how to create a simple modal window with jQuery. I like jQuery, it makes everything so simple and so easy. In case you don't know what's modal window. You can click here. That's an example of a modal window. In this website, I'm using facebox (inspiration from facebook). Others, such as lightbox, thickbox, multibox, litebox...... it's too many of t
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
簡単にモーダルウインドウを設置できるjQueryプラグイン「SimpleModal」 | Web活メモ帳
jquery-modalbox-plugin - Project Hosting on Google Code
[JS]クロスブラウザ対応、モーダルボックスの軽量スクリプト -SimpleModal
Blogger
http://f32.aaa.livedoor.jp/~azusa/exp3.php?f=include/ajax/jquery_plugin_window/simple_jquery_modal_window.inc&ttl=Simple+jQuery+Modal+Window+Tutorial+%82%CC%90%DD%92u%83T%83%93%83v%83%8B