To me 3D is one of the most interesting new features in CSS, adding depth and dynamism to web pages.
Of all the reading lists presented so far, I anticipate that this article will have the most changes in the future: there is much material to add. If you’re interested, I’d advise checking back regularly or following me on Twitter for updates.
Goals: Transform and animate web page elements in 3D space.
Prerequisite: Transforms and Animation
Total practice time: 2 hours
- Tips & Tricks
- Tips & Tricks II
- Web Cinemagraphs with CSS 3D
- 3D Marquee Text
If you start developing intensly with CSS 3D, I would strongly recommend reading Ana Tudor’s excellent “Things to Watch Out for When Working with CSS 3D” on CSS Tricks.
When You’re Done
You might want to check out some CSS 3D galleries to apply the techniques you’ve learned. You also might want to read up on a older technique of smoothing 2D CSS animations by pipelining them through the GPU
Photograph by Eric Balcon
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.