16. Animation

Animation is actually a pretty simple concept. At its most basic, animation is just the process of changing a value over time. That value could be the position, size, opacity, or even color of an HTML element. Used appropriately, JavaScript animation can help create a dynamic and engaging user experience for your Web site.

Animation has endless uses, so instead of a specific example, I’ll show you how to program animation utilities from the ground up. It’s also a great example of asynchronous programming and the global timer functions from Chapter 7.

Simple Animation

The following examples use this HTML document, which simply draws a small black box, to demonstrate animation concepts:

The simplest animation involves changing ...

Get The JavaScript PocketGuide now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.