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.

Function	Description
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.

Function	Description
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.