From the course: CSS: Transforms and Transitions
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
The matrix 3D transformation - CSS Tutorial
From the course: CSS: Transforms and Transitions
The matrix 3D transformation
- [Instructor] In the chapter on 2D transformations, you learned that all 2D transformations are ultimately applied as matrix transformations. The same is true with 3D transformations. So, yes, I'm back again to talk about matrices, but once again, I'm going to try to keep it light and to the point. The matrix for a 3D transformation is defined using the matrix 3D function which has 16 parameter values corresponding to the 16 entries in a four by four matrix, with the 16 values entered in column order, starting with the first column, going down, and then proceeding to the second, third, and fourth columns. As with the three by three matrix we used for 2D transformations, there is a structure for the four by four matrix that can aid in our interpretation of the matrix values. For example, the scale 3D function matches a diagonal matrix in which the scaling factors for the X, Y, and Z axis are indicated by the values placed along the diagonal. When I apply this matrix to my object, I'll…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.