Author: | jestov |
---|---|
Views Total: | 12,674 views |
Official Page: | Go to website |
Last Update: | December 9, 2019 |
License: | MIT |
Preview:

Description:
A lightweight, responsive photo grid gallery with lightbox integrated that allows the user to switch between images in a popup by clicking on any thumbnail.
How to use it:
Link to the stylesheet grid-gallery.min.css
and JavaScript grid-gallery.min.js
.
<link rel="stylesheet" href="css/grid-gallery.min.css"> <script src="js/grid-gallery.min.js"></script>
Add images to the grid gallery.
<div class="gg-container"> <div class="gg-box"> <img src="1.jpg"> <img src="2.jpg"> <img src="3.jpg"> </div> <div class="gg-box"> <img src="4.jpg"> <img src="5.jpg"> <img src="6.jpg"> </div> ... more galleries here ... </div>
That’s it. Override the default settings to config the plugin.
gridGallery({ // gallery selector selector: "#mSelector", // enable dark mode darkMode: true, // or "horizontal" layout: "square", // space between images gapLength: 4, // row height rowHeight: 180, // column width columnWidth: 200 });
Changelog:
12/09/2019
- improve responsive
12/08/2019
- allows multiple galleries
12/07/2019
- close with ESC key
11/24/2019
- update class name
10/27/2019
- improve UI
04/21/2019
- improve css