Facebook Like jQuery Image Gallery Lightbox Plugin - AM2 SimpleSlider

Facebook Like jQuery Image Gallery Lightbox Plugin - AM2 SimpleSlider
File Size: 1.38 MB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Yet another jQuery plugin for creating an image gallery lightbox that features an image gallery on the left and content area on the right where can place description about the image, similar to the facebook photo viewing box.

See also:

How to use it:

1. Include the jQuery javascript library together with jQuery AM2 simple slider's files in the page.

<link href="css/SimpleSlider.css" rel="stylesheet" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/Am2_SimpleSlider.js" type="text/javascript"></script>

2. Create a simple image gallery lightbox with html unordered list.  Use data-desc attribute to set the image descriptions individually. The plugin also works with DIV elements. Make sure to give a same class to <li> elements like this:

<ul class="product-gallery">

<li class="gallery-img">
<img src='Images/img1.jpg' alt="img01">
<div data-desc="Image Descript 1"></div>
</li>

<li class="gallery-img">
<img src='Images/img2.jpg' alt="img02">
<div data-desc="Image Descript 2"></div>
</li>

<li class="gallery-img">
<img src='Images/img3.jpg' alt="img03">
<div data-desc="Image Descript 3"></div>
</li>

</ul>

3. Call the plugin and you're done. Click an image on the demo page to see it in action.

<script type="text/javascript">
$('.gallery-img').Am2_SimpleSlider();
</script>

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