Modern Image Lightbox Plugin with jQuery and CSS3 - Lightbox.js
File Size: | 19.9 KB |
---|---|
Views Total: | 4748 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Lightbox.js is a lightweight and flexible jQuery image viewer plugin for creating responsive, nice-looking single image lightbox or gallery lightbox with ease.
How to use it:
1. Include the lightbox.css
in the head section for primary lightbox styles.
<link rel="stylesheet" href="path/to/lightbox.css">
2. Include the lightbox.dist.js
after jQuery library but before the closing body tag.
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script> <script src="path/to/lightbox.dist.js"></script>
3. Create a single lightbox by adding the required data-lightbox
attribute to the image's link.
<a href="1.jpg" data-lightbox>Image</a>
4. Make sure the images have the same data-lightbox
value if you want to present them in a gallery lightbox popup with a navigation bar.
<a href="1.jpg" data-lightbox="group">Image 1</a> <a href="2.jpg" data-lightbox="group">Image 2</a> <a href="3.jpg" data-lightbox="group">Image 3</a> ...
This awesome jQuery plugin is developed by Ozpital. For more Advanced Usages, please check the demo page or visit the official website.