Skip to content

24 ways to impress your friends

Vote down?

Kevin Haggerty

Good overview, 3d transforms in CSS are the wave of the future. Must be used responsibly!

Here’s some 3d transforms in action on my portfolio site, with added scale transforms to zoom in on the action whenever the user plays a video:

http://splatcollision.com

Also, in my experimentation, there’s a neat trick to getting 2d elements (such as interface panels) overlaid on 3d space (such as a layout/animation editor) – crucial for tool-building.

Set your 2d elements to have “-webkit-perspective: 0” and “-webkit-transform: translate3d(0,0,10000px)” ( or any big enough z-value) This will render those 2d elements as 3d but with flat perspective.