In the previous article I talked about
steps() in CSS animation, and provided a simple example (the ticking second hand of an analog watch). The same core techniques can be used for more complex animation, including a cartoon figure’s walk cycle.
I’ve long found
steps() a curious feature of the CSS animation specification. Rarely used in development and tricky to understand, I gave the feature fairly short shrift in my last book (Pro CSS3 Animation). However,
steps() has a few perfect areas of application, and can be easily understood with the right analogies.