Fullscreen Responsive jQuery Lightbox Gallery Plugin - simpleGallery
File Size: | 4.41 KB |
---|---|
Views Total: | 2427 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Just another jQuery gallery plugin which allows the visitor to navigate between a group of images in a fullscreen, responsive lightbox view. With support for prev/next arrows navigation, close button and image loader.
Basic Usage:
1. Include the simpleGallery.css in the header of the document.
<link href="simpleGallery.css" rel="stylesheet">
2. Include jQuery library and the jQuery simpleGallery plugin in the footer.
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="jquery.simpleGallery.js"></script>
3. Insert a group of thumbnails into your document and use data-full attribute to specify the paths to original images.
<div class="gallery"> <img src="thumb-1.jpg" data-full="large-1.jpg" alt="img-1"> <img src="thumb-2.jpg" data-full="large-2.jpg" alt="img-2"> <img src="thumb-3.jpg" data-full="large-3.jpg" alt="img-3"> <img src="thumb-4.jpg" data-full="large-4.jpg" alt="img-4"> <img src="thumb-5.jpg" data-full="large-5.jpg" alt="img-5"> ... </div>
4. Call the function on the parent element to initialize the lightbox gallery.
$('.gallery').gallery();
This awesome jQuery plugin is developed by w3tl. For more Advanced Usages, please check the demo page or visit the official website.