jQuery Draggable Polaroid Photo Gallery Plugin

File Size: 575KB
Views Total: 5031
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Draggable Polaroid Photo Gallery Plugin

B1nj Polaroid Gallery is a jQuery and jQuery UI for creating a polaroid like photo stack gallery that each photo can be dragged and rotated by mouse.

See also:

How to use it:

1. Include jQuery library and jQuery UI on your web page

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

2. Include B1nj Polaroid Gallery plugin after jQuery library

<script src="js/jquery.b1njPolaroidGallerry.js"></script> 
<link rel="stylesheet" media="screen" href="css/b1njPolaroidGallery.css">

3. Insert a group of images

<div id="gallery" class="b1njPolaroidGallery">
<ul>
<li><a href="img/img1-b.jpg"><img src="img/img1.jpg" alt=""></a></li>
<li><a href="img/img2-b.jpg"><img src="img/img2.jpg" alt="Coconut"></a></li>
<li><img src="img/img3.jpg" alt=""></li>
<li><a href="img/img4-b.jpg"><img src="img/img4.jpg" alt="Breakfast"></a></li>
<li><a href="img/img5-b.jpg"><img src="img/img5.jpg" alt=""></a></li>
<li><a href="img/img6-b.jpg"><img src="img/img6.jpg" alt=""></a></li>
<li><a href="img/img7-b.jpg"><img src="img/img7.jpg" alt="Colibri"></a></li>
<li><a href="img/img8-b.jpg"><img src="img/img8.jpg" alt="Nice Colibri"></a></li>
</ul>
</div>

4. Call the plugin

<script>
$(function() {
$('#gallery').b1njPolaroidGallery();
});
</script>

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