Author: | dianadi09 |
---|---|
Views Total: | 4,712 views |
Official Page: | Go to website |
Last Update: | October 17, 2017 |
License: | MIT |
Preview:

Description:
pureJSLightbox is a zero-dependency JavaScript library for creating a simple gallery where images open in a responsive, touch-enabled lightbox with the ability to scroll through all images with navigation arrows and swipe event.
How to use it:
Link to the pureJSLightbox’s JavaScript and Stylesheet:
<link rel="stylesheet" href="pure-js-lightbox.min.css"> <script src="pure-js-lightbox.min.js"></script>
Add class “pure-js-lightbox-container” to your gallery container.
<!-- Add class "pure-js-lightbox-container" to your gallery container--> <ul id="gallery" class="pure-js-lightbox-container"> <li><a href="1.jpg"><img src="1.jpg"/></a></li> <li><a href="2.jpg"><img src="2.jpg"/></a></li> <li><a href="3.jpg"><img src="3.jpg"/></a></li> <li><a href="4.jpg"><img src="4.jpg"/></a></li> <li><a href="5.jpg"><img src="5.jpg"/></a></li> <li><a href="6.jpg"><img src="6.jpg"/></a></li> </ul>
Initialize the gallery lightbox and you’re done.
var test = new pureJSLightBox();
Configuration options with default values.
var test = new pureJSLightBox({ // shows fullscreen overlay overlay: true, // shows navigation arrows navigation: false, // enable swipe swipe: false });
It is good but i couldnt use it for different objects of the same page. i have couple images on my page and every one of them has 3 -4 pictures. I want to open the images when i click on the preview image. but it doesnt work. Can u please help me about it.
Is there a way to enable keyboard support?