Animation: Animation Easing
+ +
+
+
+ +
This demonstrates how to use the easing attribute to change the behavior of the animation.
Click the icon in the header to shrink the element's height to zero with Y.Easing.backOut.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Animation Demo
+ toggle +
+
+This an example of what you can do with the YUI Animation Utility.
+Follow the instructions above to see the animation in action.
+This is placeholder text used to demonstrate how the above animation affects subsequent content.
+ + + + + +Setting up the HTML
+First we add some HTML to animate.
+ + +Creating the Anim Instance
+Now we create an instance of Y.Anim, passing it a configuration object that includes the node we wish to animate and the to attribute containing the final properties and their values.
Running the Animation
+Finally we add an event handler to run the animation.
+ + +