Versatile jQuery Image Lightbox/Slider/Gallery Plugin - miniSet

File Size: 5.12 MB
Views Total: 4356
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Versatile jQuery Image Lightbox/Slider/Gallery Plugin - miniSet

miniSet is a most versatile jQuery plugin that provides a simple way to display your images in the lightbox, slideshow or lightbox gallery.

Features:

  • Lightbox: Click on an image to open the Lightbox. Click anywhere or press ESC to close it.
  • Slider: Click on the bullet points under the Slider to change the image or wait a moment for the image to change by itself.
  • Gallery lightbox: Click one of the Gallery images to enlarge it and navigate through the Gallery by clicking on left or right arrows.

Basic usage:

1. Include jQuery library together with miniset.css and miniSet.js in your Html page.

<link href="css/miniset.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src='js/miniSet.js'></script>

2. Wrap your images into a container.

<div class="demo">
  <img src="img/1.jpg">
  <img src="img/2.jpg">
  <img src="img/3.jpg">
</div>

3. Display the images in a slider.

$('#demo').showSlider({
'height': 300,
'fadeTime': 500,
'intervalTime': 5000,
'tray': true
});

4. Display the images in a gallery lightbox.

$('#demo').showGallery({
'imgCounter': true,
'width': 165,
'height': 95
});

5. Display a lightbox for an image without JavaScript.

<div class="ms-lightbox-group">
  <img src="1.jpg" class="ms-lightbox" title="my_title 1">
  <img src="2.jpg" class="ms-lightbox" title="my_title 2">
  <img src="3.jpg" class="ms-lightbox" title="my_title 3">
  <!-- ... -->
</div>

This awesome jQuery plugin is developed by agniukaitis. For more Advanced Usages, please check the demo page or visit the official website.