【Javascript】フル機能のJavaScriptライトボックスギャラリーlightgallery

lightgalleryはフル機能のJavaScriptライトボックスギャラリー。レスポンシブで動画なども扱えます。

CSS and JavaScript

<head>
<link rel="stylesheet" href="css/lightgallery.css">
</head>
<body>
...
<script src="js/lightgallery.min.js"></script>
<!-- lightgallery plugins -->
<script src="js/lg-thumbnail.min.js"></script>
<script src="js/lg-fullscreen.min.js"></script>
</body>
require(['./lightgallery'], function() {
require(["./lg-zoom", "./lg-thumbnail"], function(){
lightGallery(document.getElementById('lightgallery'));
});
});

Markup

<div id="lightgallery">
<a href="img/img1.jpg">
<img src="img/thumb1.jpg">
</a>
<a href="img/img2.jpg">
<img src="img/thumb2.jpg">
</a>
...
</div>

呼び出し

<script>
lightGallery(document.getElementById('lightgallery'));
</script>
 
lightgallery

【Javascript】フル機能のJavaScriptライトボックスギャラリーlightgallery

  • LATEST
  • RELATED
  • POPULAR