February 16, 2009
by Chris Coyier
We've been down the jQuery "sliders" path a few times before. Once for the
Auto-Playing Featured Content Slider and again for the Start/Stop slider.
Many of the concepts presented in those tutorials are the same with this slider, so I'm not going to throw a lot of source code at you this time. The big difference here is that there are
buttons to change panels and the panels zoom in and out. Fun!
View Demo Download Files
UPDATED Feb 16, 2009:
Issue with double clicking fixed. Next animation can only start when current animation is complete.
UPDATED Feb 17, 2009 ( Noah Hendrix):
Keyboard support added, arrow keys, spacebar, and enter key
Code cleaned up, number of panels and initial widths/sizes are no longer hard coded, so easier to build upon
Clicking on non-active left or right panels also triggers animation
UPDATED July 15, 2010:
Moved to GitHub Turned into actual plugin with more features
UPDATED August 17, 2012: Share On
Treehouse is where you go to learn HTML, CSS, and how to build iOS apps. It's a complete education in modern web and app technology, designed to get you ready for a hot new job or to kickstart your own business.
The Lodge is a member login only area with access to video training on how to build websites from scratch using the best modern tools.
Wufoo is the most powerful online form builder out there. Easily build multi-page forms, add logic and branching, customize the design, take payments, and much more.
Try it free!
*May or may not contain any actual "CSS" or "Tricks".