Home

2collegebums edited this page Sep 13, 2010 · 22 revisions
Clone this wiki locally

Basic idea is that you can easily setup complex animations by morphing easily between classes. Yes scriptaculous has this but try actually morphing between multiple classes and having it work smoothly. Here it works very easily with no hassle.

Animate element based on classes:
element.animate(<classesToSet>)
Animate element by swapping set of classes for another:
element.animateSwap(<classesToRemove>, <classesToAdd>)

Box 1

onLoad => $('one').animateSwap('blue', 'red', { duration : '3000' }); onClick => $('one').animateSwap('red short', 'green long');



Click

Box 2


onLoad  => $('two').animate('boxed green short', { duration : '2000', delay : 2 });
onClick => $('two').animate('boxed purple wide', { duration : '2000' });

Click