lightgallery

ui-component responsive modal

lightgalleryはjQueryをベースにした軽量でカスタマイズ可能なモジュラー型レスポンシブライトボックスギャラリープラグインです。このライブラリを使用すると、画像、ビデオなどのメディアコンテンツを美しく効果的に表示できます。

Latest Ver 2.8.3

Homepage

Github

6,711

光を追えば、ギャラリーが広がる。

lightgalleryで美しい画像やビデオをエレガントに展示しましょう。

jQueryを基にした軽量なライトボックスギャラリープラグイン

CDNダウンロード

License: MIT

Asset Type :

すべてのバージョンを見る

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/comment/lg-comment.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/comment/lg-comment.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/comment/lg-comment.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/comment/lg-comment.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/comment/lg-comment.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/fullscreen/lg-fullscreen.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/fullscreen/lg-fullscreen.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/fullscreen/lg-fullscreen.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/fullscreen/lg-fullscreen.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/fullscreen/lg-fullscreen.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/hash/lg-hash.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/hash/lg-hash.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/hash/lg-hash.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/hash/lg-hash.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/hash/lg-hash.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/mediumZoom/lg-medium-zoom.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/mediumZoom/lg-medium-zoom.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/mediumZoom/lg-medium-zoom.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/mediumZoom/lg-medium-zoom.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/mediumZoom/lg-medium-zoom.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/pager/lg-pager.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/pager/lg-pager.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/pager/lg-pager.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/pager/lg-pager.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/pager/lg-pager.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/relativeCaption/lg-relative-caption.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/relativeCaption/lg-relative-caption.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/relativeCaption/lg-relative-caption.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/relativeCaption/lg-relative-caption.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/relativeCaption/lg-relative-caption.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/rotate/lg-rotate.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/rotate/lg-rotate.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/rotate/lg-rotate.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/rotate/lg-rotate.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/rotate/lg-rotate.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/share/lg-share.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/share/lg-share.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/share/lg-share.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/share/lg-share.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/share/lg-share.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/thumbnail/lg-thumbnail.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/thumbnail/lg-thumbnail.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/thumbnail/lg-thumbnail.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/thumbnail/lg-thumbnail.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/thumbnail/lg-thumbnail.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/video/lg-video.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/video/lg-video.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/video/lg-video.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/video/lg-video.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/video/lg-video.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/vimeoThumbnail/lg-vimeo-thumbnail.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/vimeoThumbnail/lg-vimeo-thumbnail.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/vimeoThumbnail/lg-vimeo-thumbnail.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/vimeoThumbnail/lg-vimeo-thumbnail.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/vimeoThumbnail/lg-vimeo-thumbnail.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/zoom/lg-zoom.es5.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/zoom/lg-zoom.es5.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/zoom/lg-zoom.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/zoom/lg-zoom.umd.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/zoom/lg-zoom.umd.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-autoplay.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-autoplay.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-comments.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-comments.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-fullscreen.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-fullscreen.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-medium-zoom.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-medium-zoom.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-pager.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-pager.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-relative-caption.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-relative-caption.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-rotate.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-rotate.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-share.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-share.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-thumbnail.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-thumbnail.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-transitions.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-transitions.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-video.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-video.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery-bundle.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery-bundle.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery-core.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery-core.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/fonts/lg.svg

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/fonts/lg.ttf

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/fonts/lg.woff

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/fonts/lg.woff2

https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/images/loading.gif

Sample Code

⚠️ import 文を含む一部のコードは、jsFiddleで正しく実行されない場合があります。エラーが発生した場合は、コードをコピーしてご自身の環境でお試しください。

📄 HTML
<div id="lightgallery"><a href="image1.jpg"><img src="thumb1.jpg"/></a><a href="image2.jpg"><img src="thumb2.jpg"/></a></div><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/js/lightgallery.min.js"></script><script>$(document).ready(function() { $('#lightgallery').lightGallery(); });</script>

🎨 External CSS
<link href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/css/lightgallery.min.css" rel="stylesheet">

🧩 External JS
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/js/lightgallery.min.js"></script>

⚙️ JavaScript
$(document).ready(function() { $('#lightgallery').lightGallery(); });