Examples of CSS-3 Transitions

Hover over some of the links on this page and note the effect. These examples were modified from those in the CSS-3 for Web Designers book by Dan Cederholm. Each link will have a different transition effect when you hover over it. Don't forget you can use your keyboard to set the focus to a specific link instead of using the mouse to hover the cursor over the link.

Don't forget to test in multiple browsers (some support these transitions better than others). Also, examine the source code to better understand how these effects are generated. Note that there is a "graceful degradation" from browser specific to the assumed eventual CSS-3 declaration.