Author: | PascalKleindienst |
---|---|
Views Total: | 2,658 views |
Official Page: | Go to website |
Last Update: | November 1, 2016 |
License: | MIT |
Preview:

Description:
Yet another lightbox galley JavaScript library used for showcasing your images in a lightbox-style gallery popup where the users are able to navigate between images through arrow and keyboard navigation.
How to use it:
Add the saga-gallery’s JavaScript and CSS files to the html page.
<link href="saga-gallery.min.css" rel="stylesheet"> <script src="saga-gallery.min.js"></script>
Insert your images into an unordered html list as this:
<ul id="gallery"> <li> <img src="1.jpg" alt="Product Image 1"> <div class="saga-description"><h3>Lorem</h3><p>Ipsum dolor sit amet</p></div> </li> <li><img src="2.jpg" alt="Product Image 2"></li> <li><img src="3.jpg"" alt="Product Image 3"></li> <li><img src="4.jpg"" alt="Product Image 4"></li> </ul>
Create a new SagaGallery object and we’re done.
var gallery = new SagaGallery('gallery');
Default configurations of the SagaGallery library.
var gallery = new SagaGallery('gallery',{ // called after closing onClose: null, // called after opening onOpen: null, // return to the first image after the last image is reached loop: true });
API methods.
// open gallery gallery.open(); // close gallery gallery.close(); // check if gallery is opened if (gallery.isOpen()) // do something ... // display next image gallery.next(); // display prev image gallery.prev();