jQuery Plugin For Rotating Elements Clockwise or Counterclockwise - Aperture

File Size: 1.21 MB
Views Total: 3387
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Rotating Elements Clockwise or Counterclockwise - Aperture

Aperture is a jQuery and jQuery UI based plugin for rotating a group of html elements Clockwise or Counterclockwise. It it good for creating a beautiful image gallery with a integrated lightbox plugin.

You might also like:

Basic Usage:

1. Include jQuery library, jQuery UI and jQuery Aperture on your html page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script src="../js/jquery.aperture.js"></script> 

2. Markup Html Structure

<div id="container"> 
<a href="images/1.jpg"><img src="images/thumb/1.jpg" alt="Photo1" /></a> 
<a href="images/2.jpg"><img src="images/thumb/2.jpg" alt="Photo2" /></a> 
<a href="images/3.jpg"><img src="images/thumb/3.jpg" alt="Photo3" /></a> 
<a href="images/4.jpg"><img src="images/thumb/3.jpg" alt="Photo4" /></a> 
...
</div>

3. Include jQuery Aperture CSS to style your plugin

<link rel="stylesheet" type="text/css" href="../css/aperture.css">

4. Call the plugin with options

$(function() {

$('#container')
.aperture({
columns: '5',
duration : 400,
imgWidth : '190px',
imgHeight : '130px',
});

});

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