Package Exports
- css-transform-matrix
- css-transform-matrix/dist/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-transform-matrix) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
😊css-transform-matrix
This is a CssMatrix class as defined by the w3c CSS3 3d Transforms specification.
You can easily customize what you want with the matrix
🎉 Installation
npm install css-transform-matrix📝 Usage
It should be compatible with documentation defined at w3.org and at WebKitCSSMatrix Safari documentation.
🚀 Example
import {CssMatrix} from "css-transform-matrix";
const matrix = new CssMatrix();
// 1. move the image down to the right by 30 pixels
matrix.move(30, 30);
// 2. enlarge the image 1.2x at (50, 50)
matrix.scaleAtPoint(1.2, 50, 50);
// 3. rotate the picture 30 degrees clockwise at (50, 50)
matrix.rotateAtPoint(30, 50, 50);
// 4. make your transform work
element.style.transform = matrix.toString();🔧 All Methods
- move(x, y)
- moveX(x)
- moveY(y)
- scale(s)
- scaleAtPoint(s, x, y)
- scaleX(s, x)
- scaleY(s, y)
- rotate(degree)
- rotateAtPoint(degree, x, y)
- toString()