通过 js 组合 css3 转换

请问有没有办法随着时间的推移结合更多的 CSS3 转换？ 例如当我设置这个

$bgWrapper.css({
 '-webkit-transform' : ' scale3d(' + currScale + ', '+ currScale +', 1)'
});

然后过了一会儿这个

$bgWrapper.css({
'-webkit-transform' : 'translate3d('+ ((currCoords[0])/currScale) +'px, '+ ((currCoords[1])/currScale) +'px, 0px) '
});

我遇到一个问题。第一个转换被第二个转换覆盖，但这就是我绝对不希望发生的事情。 所以我发现我可以组合这些值，这样我就可以暂时存储旧值并执行此操作

var tmpTransform = $bgWrapper.css('-webkit-transform');
$bgWrapper.css({
'-webkit-transform' : ''+ tmpTransform +'translate3d('+ ((currCoords[0])/currScale) +'px, '+ ((currCoords[1])/currScale) +'px, 0px) '
});

但即使这不正确，重复调用也存在问题。

那么有没有办法通过javascript获取css3比例的精确值？有没有办法通过js获取CSS3翻译的准确值？ 目前我只得到具有这些值的矩阵，当然我可以解析它，但我希望有更好的解决方案。

最后..我想-webkit-transform：matrix(...)在iPad上不是硬件加速的，所以唯一的方法是matrix3d？正确地结合所有这些转换没有问题..

非常感谢，希望您能理解我的问题：）

您需要操纵矩阵才能完成您想做的事情：

   var transform = new  WebKitCSSMatrix(window.getComputedStyle(element).webkitTransform);
   transform = transform.rotateAxisAngle(0,0,0,45)
   element.style.webkitTransform = transform;

The methods for manipulating WebkitCSSMatrix http://developer.apple.com/library/safari/#documentation/AudioVideo/Reference/WebKitCSSMatrixClassReference/WebKitCSSMatrix/WebKitCSSMatrix.html#//apple_ref/doc/uid/TP40009363 are:

.multiply()
.inverse()
.translate()
.scale()
.rotate()
.rotateAxisAngle()
.skewX()
.skewY()

您可以在此处查看演示：

http://jsfiddle.net/6jGaA/ http://jsfiddle.net/6jGaA/