CSS3 Transition Life-Cycle

Example 1 - Hover

Example 2 - Using a Class

Add Remove Toggle

Example 3 - Automatically Revert

Add Class and Remove When Transition Ends

Example 4 - Cancel the Revert Phase

Add Remove

Example 5 - Different Durations for Transition In/Out

Add Remove

Example 6 - Different Transition In/Out

Add Remove

Example 7 - Sprite Animation using CSS