Export (0) Print
Expand All
2 out of 3 rated this helpful - Rate this topic

Transform Functions

This section contains reference documentation for the Cascading Style Sheets (CSS) transform functions that are supported in Windows Internet Explorer. Support for 2-D Transforms was added in Windows Internet Explorer 9, while support for 3-D Transforms was added in Internet Explorer 10.

2-D Transform functions

The following transform functions are supported for use in 2-D Transforms. They can be used in Internet Explorer 9 and later.

FunctionDescription

matrix()

Specifies a 2-D transformation in the form of a transformation matrix of six values.

rotate()

Specifies a 2-D rotation by the angle specified in the parameter about the origin of the element.

scale()

Specifies a 2-D scale operation by the [sx,sy] scaling vector that is described by the two parameters.

scaleX()

Specifies a scale operation by using the [sx,1] scaling vector, where sx is given as the parameter.

scaleY()

Specifies a scale operation by using the [1,sy] scaling vector, where sy is given as the parameter.

skew()

Specifies a skew transformation along the x- and y-axes. The first angle parameter specifies the skew on the x-axis. The second angle parameter specifies the skew on the y-axis.

skewX()

Specifies a skew transformation along the x-axis by the given angle.

skewY()

Specifies a skew transformation along the y-axis by the given angle.

translate()

Specifies a 2-D translation by the vector [tx,ty], where tx is the first translation-value parameter and ty is the optional second translation-value parameter.

translateX()

Specifies a translation by the given amount in the x direction.

translateY()

Specifies a translation by the given amount in the y direction.

 

3-D Transform functions

The following transform functions are supported for use in 3-D Transforms. They can be used in Internet Explorer 10 and later.

FunctionDescription

matrix3d()

Specifies a 3-D transformation as a 4×4 homogeneous matrix of sixteen values in column-major order.

perspective()

Changes the perspective through which an element is viewed, giving an illusion of depth.

rotate3d()

Specifies a clockwise 3-D rotation.

rotateX()

Specifies a clockwise rotation by the given angle about the x-axis.

rotateY()

Specifies a clockwise rotation by the given angle about the y-axis.

rotateZ()

Specifies a clockwise rotation by the given angle about the z-axis.

scale3d()

Specifies a 3-D scale operation by the [sx,sy,sz] scaling vector described by the three parameters.

scaleZ()

Specifies a scale operation using the [1,1,sz] scaling vector, where sz is given as the parameter.

translate3d()

Specifies a 3-D translation by the vector [tx,ty,tz], where tx, ty, and tz are the first, second, and third translation-value parameters respectively.

translateZ()

Specifies a translation by a given amount in the z-direction.

 

 

 

Did you find this helpful?
(1500 characters remaining)
Thank you for your feedback
Show:
© 2014 Microsoft. All rights reserved.