HTML and CSS Reference
In-Depth Information
Classified intel
We used the y-axis to rotate the card. Another efect is rotaing it on the x-axis. Furthermore,
the rotaion doesn't necessarily happen at the center point. The rotaion origin can be set by
the transform-origin property. The following two URLs link to examples that make use of 3D
transform properies to create diferent efects:
F
http://jsfiddle.net/makzan/N7UnH/
F
http://jsfiddle.net/makzan/QMQLQ/
The following screenshot shows the rotaion efect:
Microsot created an interacive tool to play with a combinaion of transform-related
properies, which can be found at
http://ie.microsoft.com/testdrive/graphics/
hands-on-css3/hands-on_3d-transforms.htm
.
David DaSandro wrote a detailed tutorial on how to make use of the 3D transform to create
different effects, which can be found at
http://desandro.github.io/3dtransforms/
.
