Adding Animation Effects

The Yahoo! User Interface Library’s Animation Utility allows you to add many sorts of animated effects to YUI objects. You can make graphics and other objects bigger or smaller; fade them in or out; animate colors; move objects across the page; move them along a specified path; and scroll text fields horizontally, vertically, or both. And of course, the combinations and possibilities are almost endless.

In this example, we’re going to show you how to animate the dialog we used in the previous task. The additions to the HTML are in Script 14.13, and the ones to the JavaScript are in Script 14.14.

Script 14.13. This HTML has a different title and calls additional libraries than Script 14.10, but it is otherwise identical. ...

Get JavaScript and Ajax for the Web: Visual QuickStart Guide, Seventh Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.