CSS3 has introduced transitions into the web design world. Simply put, you can assign a “watcher” to an element and an property of the element (like a height on a certain selector), and when it changes it can smooth the transition between the states. Transitions are not support in Internet Explorer, so users will see the instantaneous jump between the two states of the CSS. Also, not all properties in your CSS can be animated. There is a lot to learn, so here are a few useful resources to get started with:
- W3Schools – CSS3 Transitions
- MDN CSS Transitions
- Table of CSS Animatable Properties
- Understanding CSS3 Transitions
When do I use transitions?
Note: Too much of anything is bad. Just because there are transitions doesn’t mean every layout change needs to have them applied to it.