css - CSS 3D 变换容器来反转孩子的 3D 变换

Question

在以下 HTML

<article>
    <div></div>
</article>

thediv绝对定位在 the 内的任意位置，article并使用任意 matrix3d 进行转换。

div如何通过变换来“反转” 的变换article，使div再次以其原始大小出现矩形？

情况如下：http: //jsfiddle.net/kBWcc/

注意：在这种情况下必须使用 matrix3d。

Answer 1

经过半天的尝试，我终于找到了一个到目前为止只支持 webkit 的解决方案，其中涉及 WebKitCSSMatrix 对象。

以下是解决方案的外观：http: //jsfiddle.net/kBWcc/2/

var t = window.getComputedStyle($('div').get(0)).webkitTransform;
  , m = new WebKitCSSMatrix(t);

$('article').css('-webkit-transform', m.inverse());
$('div').css('-webkit-transform', m.translate(100, 100));​