如何获得CSS3-3d转换元素的屏幕位置？-HowtogetscreenpositionofCSS3-3dtransformedelements?

13  

Have you tried using getBoundingClientRect()?

你尝试过使用getBoundingClientRect（）吗？

I've used it successfully in the past to calculate the dimensions of elements that have been transformed with the transform property.

我在过去成功地使用它来计算已使用transform属性转换的元素的维度。

1  

The problem is, that the CSS3 transformations doesn't actually change the position of the elements in anyway. Of course the browsers "know" that they are repositioned, because it renders them, but this information is not provided back to the DOM/API.

问题是，CSS3转换实际上并没有改变元素的位置。当然浏览器“知道”它们被重新定位，因为它呈现它们，但是这些信息不会提供给DOM / API。

The only thing I can think of, is to calculate the positions based on the transformations yourself, since these are "simple" matrix transformations.

我唯一能想到的是自己根据变换计算位置，因为这些是“简单”的矩阵变换。

Unfortunately Algebra class has been too long ago, that I can't tell you anymore how to do it - only that it is possible.

不幸的是，代数课程已经很久了，我不能告诉你如何去做 - 只有这样才有可能。

0  

Using getBoundingClientRect is a good idea but will only give you the coordinates of the rectangle that contains your shape, not the exact coordinates of the 4 topleft, bottomright, bottomleft, topright corners.

使用getBoundingClientRect是一个好主意，但只会给你包含你的形状的矩形的坐标，而不是4个topleft，bottomright，bottomleft，topright corner的确切坐标。

You'd only be able to do this by taking each of those non-transformed coordinates and applying the transform via Javascript.

你只能通过获取每个非变换坐标并通过Javascript应用变换来实现这一点。