Package Exports
- perspective-transform.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 (perspective-transform.js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
PerspectiveTransform#
This is an extremely useful class for advanced CSS 3d animation. You can set the x, y point of the corners of a DOM element and do need to think about the complicated Matrix formula behind it.
##Usage##
// create PerspectiveTransfrom
var transform = new PerspectiveTransform(elem, width, height, useBackFacing);
// the properties represent the 4 corners are "topLeft", "topRight", "bottomLeft" and "bottomRight"
transform.bottomRight.x = 200;
transform.bottomRight.y = 200;
// check the polygon error before updating
if(transform.checkError()==0){
transform.update(); // update the perspective transform
elem.style.display = "block"; // show the element
}else{
elem.style.display = "none"; // hide the element
}
##Firefox on retina screen fix##
PerspectiveTransform.useDPRFix = true; // put true if you need to apply this fix
window.onresize = function(){
PerspectiveTransform.dpr = window.devicePixelRatio; // update the dpr
transform.update(); // update the PerspectiveTransform instance
}
##Credit## The original PerspectiveTransform.js is created by Israel Pastrana http://www.is-real.net/experiments/css3/wonder-webkit/js/real/display/PerspectiveTransform.js
Matrix Libraries from a Java port of JAMA: A Java Matrix Package, http://math.nist.gov/javanumerics/jama/ Developed by Dr Peter Coxhead: http://www.cs.bham.ac.uk/~pxc/ Available here: http://www.cs.bham.ac.uk/~pxc/js/
I simply removed some irrelevant variables and functions and merge everything into a smaller function. I also added some error checking functions and bug fixing things.