This plug-in was intended to be used to display feature stories on a home page of a website, but can be used for any reason and is highly customizable. It will always display three images at the same time, with all the rest hidden behind the center image. I have detailed instructions for using the plug-in, as well as a list of all the options and some frequent questions. If you have any questions about the carousel, please post a comment below.
- Arrange div's of content in a 3-D, rotating carousel.
- Currently supports one flanking 'feature' on either side of center feature.
- Show clickable indicators (blips) of what feature is currently at the center.
- Display text overlay on bottom of feature (can be included anywhere on image using CSS, and below image using an option)
- Speed, effects, locations, and more are all changeable.
- See in action on Rowan University's homepage.
- Works in Chrome, FireFox, Safari, and IE6+.
- Works with jQuery v1.3+.
- Automatically preloads images before fireing up the carousel.
Basic & default demonstration
How to Use
In the ZIP that you downloaded, you should have all the necessary files to get the demonstration displayed above to work. Simply alter the example as you see fit. Make sure you have done the following
- Included the jQuery library (version 1.3 minimum) and the carousel script (after jQuery) using HTML script tags in your HTML header
- Added in the CSS for the carousel somewhere in your document header
- Structured the HTML properly as outlined in the example
- Initiated the carousel script like below:
You should be good to go with the carousel now. Toy around with the available options and try and get it to do what you want. If you have any issues with it, check the FAQ, and then check the comments here. Maybe someone solved the problem for you.