&lt,transform-function&gt, – CSS | MDN

Account creation on MDN is disabled while we upgrade our moderation mechanisms. If you see something that needs to be fixed, please file a bug: https://bugzilla.mozilla.org/form.doc and we'll handle it as soon as we can. Thanks for your patience! The <,transform-function>, CSS data type denotes a function applied to an element's representation in order to modify it. Usually such transform may be expressed by matrices and the resulting images can be determined using matrix multiplication on each point. There are several coordinate models used when describing transformation. The most common are the Cartesian coordinate system and homogeneous coordinates. In Cartesian coordinates each point of the Euclidian space is described using two values, the abscissa and the ordinate. The origin, the (0, 0) is the top-left corner of the element. Unlike the usual geometric convention, and like most cases in computer graphics, the y-axis goes to the bottom. Each point is mathematically described using the vector notation (x,y). Applying the transformation consists in doing, for each point, the matrix multiplication between both: With this notation, it is possible to describe, and therefore composite, most usual transformations: rotations, scaling, or skewing. In fact all transformations that are linear functions can be described. One major transformation is not linear and therefore must be special-cased when using this notation: translation. The translation vector (tx, ty) must be expressed separately, as two more parameters. Möbius' homogeneous coordinates in projective geometry leading to 3x3 transformation matrices, though more complex and unusual for non-specialists, doesn't suffer from the translation limitation as these can be expressed as linear functions in this algebra, removing the need for special cases. Several functions are available to describe transformations in CSS. Each one applies a geometric operation, in 2D or 3D: [1] Gecko 14.0 removed the experimental support for skew(), but it was reintroduced in Gecko 15.0 for compatibility reasons. As it is non-standard and will likely be removed in the future, do not use it. Before Firefox 16, the translation values of matrix() and matrix3d() could be <,length>, in addition to the standard <,number>,. [2] Internet Explorer 5.5 or later supports a proprietary Matrix Filter which can be used to achieve a similar effect. Internet Explorer 9.0 or earlier has no support for 3D transforms. Mixing 3D and 2D transform functions, such as -ms-transform: rotate(10deg) translateZ(0),, will prevent the entire property from being applied. Source.


Яндекс.Метрика Рейтинг@Mail.ru Free Web Counter
page counter
Last Modified: April 22, 2016 @ 7:10 am