Sprite3D.js

A library for generating
and manipulating CSS 3D transforms

Sprite3D.js makes it easy to manipulate HTML elements in 3D space through CSS 3D transforms using a simple syntax and a bunch of chainable functions.

Sprite3D.js extends your DOM elements with helper functions allowing you to control their position, rotation and scale. Use the document structure like a display object scenography, listen to native DOM events and keep your content intact for a better SEO.

You can conveniently use CSS styling to control the aspect of your elements, and CSS transitions to animate your stuff. In many cases, 3D transforms are GPU-accelerated, giving you an incredible performance boost.

The semantic aspect of the page can be respected, and the browsers that do not support CSS 3D transforms will display your content in a regular way.

Sprite3D.js has no dependencies, is cross-browser compatible using automatic prefix detection and provides information about its support.

Browser support (Feb.2012)

Desktop browsers :

• Safari, Chrome are OK
• Firefox 10+ is OK
• IE 10 has been announced with great support, needs testing
• Opera has people working on 3D transforms (no release date)

Mobile :

• iOS' Mobile Safari : OK
• BlackBerry Tablet OS : OK
• Android 4 : OK (Android 3 has some support for 3D transforms, but performance is not at its best)

Documentation

See the dedicated doc page.

Check the examples too...