Simply take a look at… CodePen lol. There was a (lengthy) time when it didn’t exist, although. My outdated buddy Jonathan Snook wrote in 2007 that he didn’t like the thought of animation coming to CSS in any respect, however had modified his thoughts by 2009. They’ve developed a bit since these early days. They’re GPU-accelerated now. We don’t want vendor prefixes on the properties. We are able to animate extra properties, together with the values of Customized Properties (particularly if we sort them). However they haven’t modified that a lot, and that’s one of many cool issues concerning the internet. Precise internet platform issues don’t change underneath our ft that dramatically, making them value studying as a result of that data has a protracted shelf life. What additionally evolves is how folks use them, finest practices, and the intelligent methods that should be found. Right here’s one! I noticed a weblog put up by Harold Cooper a short time again known as Spinning Diagrams with CSS. It’s since been gone’d from the web, however the ol’ archive caught it and I’ve made a Pen out of it, too, for posterity. Harold was exhibiting off mathematical formulation that benefitted from a 3D look, like this: I fully wimped on the market and used an animated GIF. However Harold didn’t: A number of folks expressed shock that the spinning diagrams don’t use any JavaScript or animated picture codecs, simply HTML and CSS. One of many cool elements of Harold’s tough is utilizing one animation to spin issues, and one other animation to unspin them. Discover how the numbers at letters seem to maneuver in 3D area, however at all times “face ahead”. No person was interested by that in 2007, I’ll inform ya that. I bear in mind I first learn this put up over RSS and the animations labored even in RSS. Most likely as a result of the styling was inbuilt
