By default, Matrix.js automatically center objects with the following transform:
translate3d(-50%, -50%, 0)And every
MX.Object3d
comes with the class .mx-object3d
. Matrix.js will automatically inject/remove the following CSS rules:
.mx-object3d { position: absolute; top: 50%; left: 50%; }
Sometimes we want to add 3D movement to exsiting DOM nodes without tampering with their positioning. This page shows that you can disable the default centering behaviour by simply setting:
MX.positionAtCenter = false