如何标记-webkit-transform-origin的位置？

Question

我正在使用CSS3来创建CSS动画。我正在使用rotateX旋转图像。我想以某种方式标记原点的位置，以便我可以准确地看到旋转点的位置。

如何标记-webkit-transform-origin的位置？我对任何解决方案，CSS或JavaScript都持开放态度。

Answer 1

在我正在使用的chrome版本（版本18）中，任何元素的-webkit-transformation-origin最初始终是元素的中心， relative 到该元素，其中两个坐标被淹没了。所以，如果

element.style.webkitTransformationOrigin

是一个空字符串，然后是

Math.floor(element.width/2) + "px " + Math.floor(element.height/2) + " px"。

如果它不是空字符串，那么它将采用该格式[x]px [y]px，在两个坐标之间有一个空格。如果需要，您可以使用正则表达式提取值，就像在您的情况下一样，并且由于该值是相对于元素的，因此您将必须获取页面上元素的绝对位置并将原点添加到那是为了得到你原点的绝对位置。