CSS Animations For Frontend Engineers
© 13 September, 2013, Martin Rinehart
CSS3 works in all modern browsers, desktop and mobile. It does not work in Microsoft browsers IE 9 and before.
The Animated Div
demo div, animation styles first: name and duration, top line.
alternate means reverse directions, alternate iterations.
linear is the timing function (default is
The @Keyframes Rules
One plain, one for
-webkit-. The only difference is the name of the rule (you copy the entire contents).
0% and end with
100%. Call these
to if you prefer. Use as many intermediate frames as you like.
Feedback: MartinRinehart at gmail dot com
# # #