Tuesday, June 7, 2011

Rotating Image Slider with jQuery




View demo    Download source

In the following tutorial we will create an asymmetrical image slider with a little twist: when sliding the pictures we will slightly rotate them and delay the sliding of each element. The unusual shape of the slider is created by some elements placement and the use of thick borders. We will also add an autoplay option and the mousewheel functionality.
We’ll use the jQuery 2D Transformation Plugin for rotating the images and the jQuery Mousewheel Plugin by Brandon Aaron for the mousewheel control.
The beautiful photos are by Andrew and Lili and you can see their Behance profile here:

http://www.behance.net/AndrewLili

The images are licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License.
Allrighty! Let’s start with the HTML!

0 comments:

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Hostgator Discount Code