var nowDeg = $("#pan2").css("transform");结果,弹出的 nowDeg 的值是:matrix(0.707107, 0.707107, -0.707107, 0.707107, 0, 0),也就是矩阵。这没法使用,因为要将角度参与到计算当中。
矩阵是可以转换成普通的角度的,只要使用下面的函数即可:
/* * 解析matrix矩阵,0°-360°,返回旋转角度 * 当a=b||-a=b,0<=deg<=180 * 当-a+b=180,180<=deg<=270 * 当a+b=180,270<=deg<=360 * * 当0<=deg<=180,deg=d; * 当180<deg<=270,deg=180+c; * 当270<deg<=360,deg=360-(c||d); * */ function getmatrix(a,b,c,d){ var aa=Math.round(180*Math.asin(a)/ Math.PI); var bb=Math.round(180*Math.acos(b)/ Math.PI); var cc=Math.round(180*Math.asin(c)/ Math.PI); var dd=Math.round(180*Math.acos(d)/ Math.PI); var deg=0; if(aa==bb||-aa==bb){ deg=dd; }else if(-aa+bb==180){ deg=180+cc; }else if(aa+bb==180){ deg=360-cc||360-dd; } return deg>=360?0:deg; //return (aa+','+bb+','+cc+','+dd); }所以,我得先把得到的矩阵 matrix(0.707107, 0.707107, -0.707107, 0.707107, 0, 0) 里面的前四个参数提取出来,即将得到的值通过字符串操作方法切割成一个数组:
var values = nowDeg.split('(')[1].split(')')[0].split(','); var a = values[0]; var b = values[1]; var c = values[2]; var d = values[3];最后,将得到的四个值带入上面的函数即可:
nowDeg = getmatrix(a,b,c,d);理解上面的函数,就必须深刻了解css3的矩阵的原理,这里可参考:CSS3 Matrix(矩阵)