Magnific Popupを改訂し、Web共通に使えるようにした。Image, Inline, Gallery, Zoom Animationの機能がある。ZoomはInline Popupのみである。スライドショー表示機能はない。
拡大と同時にスライドショー表示したいときは fbox.js を使う。
Gallery Popup
クラス名を mgallery にした。※galleryは、blueimp Galleryで使用。
Inline Popup
Inline <a class="inline" href="#dialog" >Inline</a>
Zoom <a class="zoom" href="#dialog" >Zoom</a>
<link rel="stylesheet" href="/asset/zoom.css"> <script src="/asset/jquery.js"></script> ..... <div class="mgallery"> <a href="001.jpg" title="The Cleaner"><img src="001s.jpg"></a> <a href="002.jpg" title="Winter Dance"><img src="002s.jpg"></a> <a href="003.jpg" title="Uninvited Guest"><img src="003s.jpg"></a> ..... </div> ..... <script src="/asset/zoom.js"></script>
Image Popup
<a class="image" href="path-to-image.jpg">～</a>
ポップアップ画像をクリックしても閉じる。
closeBtnInside: true