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!
UPDATED Features:
* 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
Demo: http://css-tricks.com/examples/MovingBoxes/
Download: http://css-tricks.com/examples/MovingBoxes.zip
Source: http://css-tricks.com/moving-boxes/

Related Listings:
RSS feed for comments on this post. TrackBack URL
October 20th, 2009 at 2:01 am
[...] Moving Boxes using jQuery Plugin We’ve been down the jQuery “sliders” path a few times… [...]