Animation Utility: Using the End Event
This demonstrates how to use the
Click the X in the header to fade the element out and remove it from the document once the fade completes.
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 properties to be transitioned and final values.
Handling the End Event
We will need a function to run when the
end event fires. Note that the context of our handler defaults to
this refers to our Anim instance inside the handler.
Listening for the End Event
Now we will use the
on method to subscribe to the
end event, passing it our handler.
Running the Animation
Finally we add an event handler to run the animation.