With CSS3 came new ways to position and alter elements. Now general layout techniques can be revisited with alternative ways to size, position, and change elements
If you are creating a starwars theme text box an need the letters to fade into the distance
With CSS3 transitions you have the potential to alter the appearance and behavior of an element whenever a state change occurs, such as when it is hovered over, focused on, active, or targeted.
Animations within CSS3 allow the appearance and behavior of an element to be altered in multiple keyframes. Transitions provide a change from one state to another, while animations can set multiple points of transition upon different keyframes.
- Fade In
- Transitionally change background color
- Grow and shrink an object
- Rotate objects
- Transition the shape square to circle
- 3d Shadow
- Swing a shape back and forth
- Transition the border
- Change the duration of a transition
- Change the speed of a transition
- Delay a transition
- 3D Button
- Card Flip
- Shorthand transitions
You don't have to use javascript or flash to make these changes They help make your website stand out from the crowd
Making amazing websites is my goal, and using transitions can help me get there!
Watch a ball bounce and change shape in code.
I only saw three? buttons that subtly moved
A ball bouncing in a box in codepen
animated text moving around