[JS]IE7からスマフォまで全サポート、画像も動画もGoogle Mapsもあらゆるコンテンツを拡大表示するスクリプト -iLightBox

画像をはじめ、画像ギャラリー、そして動画、HTMLコンテンツ、外部サイトなど、あらゆるコンテンツを拡大表示するjQueryのプラグインを紹介します。

サイトのキャプチャ

iLightBox

iLightBoxの特徴

サイトのキャプチャ
  • あらゆるコンテンツをサポートします。
    画像、画像ギャラリー、動画(HTML5, YouTube, Vimeoなど)、Flash/swf, Google Maps, iFrame, AJAX, Alert/Confirm/Promptなど
  • 主要なブラウザ全てをサポートします。
    IE7/8/9/10, Firefox, Chrome, Safari, Opera
    iOS4+, Android
  • 主要なデバイスを全てサポートします。
    デスクトップ・タブレット・スマートフォン
    スワイプ操作やRetinaディスプレイもサポートしています。

iLightBoxのデモ

デモではあらゆるコンテンツをiLightBoxで拡大表示します。
まずは、画像一枚を拡大表示するデモから。

2013021303-01.pngのキャプチャ

デモ:一枚画像

各画像をクリックすると、拡大表示します。
左上の四角アイコンをクリックすると、全画面表示です。

2013021303-01.pngのキャプチャ

デモ:一枚画像

画像ギャラリーは右にサムネイルが表示され、ギャラリーのみスクロールして画像を次々に表示します。

2013021303-01.pngのキャプチャ

デモ:画像ギャラリー

画像は他にも多数のエフェクトがあり、下記はインライン型のギャラリーです。

2013021303-01.pngのキャプチャ

デモ:画像アドバンスド

画像だけでなく、HTMLのコンテンツも表示できます。

2013021303-01.pngのキャプチャ

デモ:HTMLコンテンツ

AJAXにも対応しています。

2013021303-01.pngのキャプチャ

デモ:AJAX

swfのFlashを表示することもできます。

2013021303-01.pngのキャプチャ

デモ:Flash

iFrameを使って、外部サイトの表示にも対応しています。

2013021303-01.pngのキャプチャ

デモ:iFrame

HTMLはその場でDOM要素をロードし、表示することもできます。

2013021303-01.pngのキャプチャ

デモ:HTMLアドバンスド

動画はYouTube, Vimeo, QuickTime, HTML5に対応しており、拡大して表示します。

2013021303-01.pngのキャプチャ

デモ:動画

画像やHTMLや動画だけでなく、Google Mapsの表示にも対応しています。

2013021303-01.pngのキャプチャ

デモ:Google Maps

alert, confirm, promptなどのダイアログも表示します。

2013021303-01.pngのキャプチャ

デモ:ダイアログ

top of page

©2017 coliss