レスポンシブ対応されたLightbox系プラグイン・ライブラリ 10

  • Posted on
  • Category : Tips
レスポンシブ対応されたLightbox系プラグイン・ライブラリ 10

レスポンシブ対応されたLightbox系のプラグインやライブラリのまとめです。ほとんどがjQueryプラグインになりますが、中には単体で動くものもあります。また、対応コンテツやエフェクトが多数あるもの、オプションがひと通り揃っているもの、動きや見栄えは少し簡易的になりますがIE7・8といったブラウザまで対応しているものなどタイプも様々です。

※対応ブラウザ・デバイスに関しては、基本的に各配布先で記載されているものになります。
ただ、特にIEの場合は対応しているが他のブラウザに比べ動きが簡易的になってしまっていたり動きが怪しいものなどもあるので、対応しているという記載があっても使用前に動きの確認をおすすめします。

Swipebox

Swipebox

その名の通りスワイプで画像を切り替えることができ、ギャラリーやビデオにも対応しているjQueryプラグイン。
オプションもスピードやオープン・クローズ時のコールバックなどよく使いそうなものは揃っていて、対応ブラウザはChrome、Safari、Firefox、Opera、IE9+、iOS 4+、Android、Windows Phoneで動作するとのことです。

Magnific Popup

Magnific Popup

jQueryもしくはZepto.jsを使うプラグインで、シングル・ギャラリー・ズームエフェクト・ビデオポップアップ・モーダルなど様々なタイプに対応しています。
対応ブラウザはChrome、Safari、Firefox、Opera、IE8+、iOS 5+、Android 2.3+、Windows Phone、その他もという感じでひと通りのブラウザ・デバイスで利用でき、IE7も部分的にサポートしているようです。

iLightBox

iLightBox

同じく様々なタイプをサポートしてるjQueryプラグインで、対応ブラウザはChrome、Safari、Firefox、Opera、IE7+、iOS 4+、Androidで動作するとのことです。

PhotoSwipe

PhotoSwipe

単体で使用できるライブラリで、よくあるキャプションやクローズボタン表示以外にも、画像を全画面表示にしたりシェアしたりするためのボタンを設置したり、タッチジェスチャーが幾つか用意されていたりもします。
対応ブラウザはChrome、Safari、Firefox、Opera、IE8+、iOS 5+、Android 2.3.7+、Windows Phone、その他もという感じでひと通りのブラウザ・デバイスで利用できます。

Fluidbox

Fluidbox

クリックした画像から拡大されるようなエフェクトのjQueryプラグインで、拡大表示する画像の背景にも画像表示させるオーバーレイイメージなどもあります。
対応ブラウザはChrome、Safari、Firefox、Opera、IE9+とのことです。

Strip

Strip

商業利用時には有償となりますが、少し変わった見せ方のjQueryプラグインで、オプションやコールバックもよく利用するようなものはひと通り揃っています。
対応ブラウザはChrome、Safari、Firefox、Opera、IE9+、iOS 5+、Android 3+とのことです。

Lightcase.js

Lightcase.js

画像表示時のエフェクトが数種類用意されており、インライン・ビデオ・Google Mapなどひと通りのコンテンツで利用できるjQueryプラグイン。
対応ブラウザはChrome、Safari、Firefox、Opera、IE9+とのことです。

baguetteBox.js

baguetteBox.js

単体で使用することができ、対応ブラウザはChrome、Safari、Firefox、Opera、IE8+とのことです。

ImageLightbox.js

ImageLightbox.js

よく使うようなオプションはひと通り揃っているjQueryプラグインで、対応ブラウザはChrome、Safari、Firefox、Opera、IE9+、iOS、Android、Windows Phoneとのことです。

flipLightBox

flipLightBox

プラグイン名にあるように、表示次のフリップされる動きが特徴のjQueryプラグインで、対応ブラウザはChrome、Safari、Firefox、Opera、IE9+となっています。

Back to Top

NxWorld

Sorry... doesn't support your browser

To get the best possible experience using our site we recommend that you upgrade to a modern web browser.NxWorldではご利用中のブラウザサポートはしていません。
Internet Explorerのアップグレード行う、もしくはその他のブラウザを使用しての閲覧をお願いします。