Chapter 8 – Animation and Effects

The main goal of this chapter is to show you how to manually create some effects and animation with your CSS and a little JavaScript. Most of the time a framework or plug-in might do this for you, but often it's easier and requires less code to write it yourself.

Example 8-1 CSS Tricks

There are three examples here. Two show sample gradients and one shows reflection of an element.

http://www.learnhtml5book.com/chapter8/tricks.php

Example 8-2 Transitions

The transition between two different CSS states via hover.

http://www.learnhtml5book.com/chapter8/transitions.php

Example 8-3 Transforms

Rotations, zooms, and some examples of 3D transforms.

http://www.learnhtml5book.com/chapter8/transforms.php

Example 8-4 Animations