プログラマが紹介する、Webサイトを簡単に華やかにするjQueryプラグイン100選!

Magnific Popup

2013-07-19

説明

LightBox系プラグインです。これ1つで、画像、ビデオ、Googleマップなどをモーダルウインドウ風に表示できます。Retinaディスプレイ対応で、動作も軽快です。

デモ

画像を1枚だけLightBox風に表示するデモ

複数の画像をLightBox風に表示するデモ

画像をズームしてLightBox風に表示するデモ

ビデオをLightBox風に表示するデモ

ビデオ (YouTube)
ビデオ (Vimeo)

GoogleマップをLightBox風に表示するデモ


Googleマップ

ダイアログをポップアップするデモ

ダイアログをポップアップする (フェードとズーム効果あり)
ダイアログをポップアップする (フェードとスライド効果あり)

Dialog example

This is dummy copy. It is not meant to be read. It has been placed here solely to demonstrate the look and feel of finished, typeset text. Only for show. He who searches for meaning here will be sorely disappointed.

フォームをポップアップするデモ

フォームを開く

フォーム

ajaxで別ファイルのHTMLをポップアップするデモ

別ファイルのHTMLを取り込んでポップアップする

閉じ方を限定したモーダルダイアログをポップアップするデモ

『閉じる』を押さないと戻れないモーダルダイアログをポップアップする

ライセンス

MITライセンスなので安心して使えます。無料ですし、改造もOKです。

動作環境

パソコンでは、Chrome、Safari、FireFox、Opera、IE8以上で動作します。

スマホでは、Android 2.3以上、iOS5以上、Blackberry 10以上、WP7以上のデフォルトブラウザで動作します。

本家サイト

http://dimsemenov.com/plugins/magnific-popup/