This article contains 109 words.

Comments on: 2D Transforms in CSS3

Another point worth noting is how transitions interact with transforms. The end-point of any transform can be represented by a matrix, but you will get very different results if you transition between 2 matrices rather than using the transform functions.

For example, rotate(720deg); combined with a transition:1s all; will result in the element spinning twice in the clockwise direction. But using the corresponding matrix — transform: matrix(1, 0, 0, 1, 0, 0); — will result no change, because when expressed as a matrix it is no different to a 0 degree rotation.

Another example of different matrix/function outcomes with transitions is shown here: http://oli.jp/bugs/browser/matrix-rotate-skew2.html

]]>