Chapter 5. Energizing pages with animations and effects

Browsers have come a long way since LiveScript—subsequently renamed JavaScript—was introduced to Netscape Navigator in 1995 to allow scripting of web pages.

In those early days, the capabilities afforded to page authors were severely limited, not only by the minimal APIs, but by the sluggishness of scripting engines and low-powered systems. The idea of using these limited abilities for animation and effects was laughable, and for years the only animation was through the use of animated GIF images (which were generally used poorly, making pages more annoying than usable).

My, how times have changed. Today’s browser scripting engines are lightning fast, running on hardware that was unimaginable 10 years ago, and they offer a rich variety of capabilities to us as page authors.

But even though the capabilities exist in low-level operations, JavaScript has no easy-to-use animation engine, so we’re on our own. Except, of course, that jQuery comes to our rescue, providing a trivially simple interface for creating all sorts of neat effects.

5.1. Showing and hiding elements

5.2. Animating the display state of elements

5.3. Creating custom animations

5.4. Animations and Queuing

5.5. Summary