HTML5, CSS3, and SVG Powered 3D Slides Deck [Video]

Brad Neuberg has created a 3D slide deck that uses HTML5, CSS3, and a bit of SVG. The main idea behind this deck is to be able to "zoom" into topics to as deep a level as necessary. Slides are nested, like an outline. "The presentation itself is a series of nested HTML5 elements, representing […]

Brad Neuberg has created a 3D slide deck that uses HTML5, CSS3, and a bit of SVG. The main idea behind this deck is to be able to "zoom" into topics to as deep a level as necessary. Slides are nested, like an outline. "The presentation itself is a series of nested HTML5 elements, representing an outline. Sections are animated and positioned using CSS 3D transforms, and the blue arrows are SVG. There're lots of embedded demos and live controls that let you experiment with HTML5, CSS3, and SVG and learn by doing. For WebGL demo to work you'll have to be using a WebGL capable browser.

The slide deck could be extended in future to work with gesture events on iPhone and iPad, and since CSS 3D is hardware-accelerated on those platforms it would be quite fast. It's also pure text, so it's search engine friendly. In addition, it could be made to degrade nicely for older browsers using media queries or other tricks," explained Brad.

More Info: Live Demo