Back in June, Will Boyd wondered what things CSS can animate, which turns out to be quite a lot.
This articles explores some of the unexpected things that CSS can animate and some nifty things you can do by animating them.
I like this demo where you choose between two options (in which a
z-index is animated):
See the Pen
Overlapping Sushi Cards by Will Boyd (@lonekorean)
One thing that surprised me very much is that you can animate
visibility, but that it has special interpolation rules:
For the visibility property,
visibleis interpolated as a discrete step where values of p between 0 and 1 map to visible and other values of p map to the closer endpoint…