Possible Duplicate:
How to get screen position of CSS3-3d transformed elements?
Playing around with CSS 3D transforms, I'm in a situation where I would like to get hold of the screen coordinates of a transformed element ('s bounding box's corners) - is there any API which provides this functionality?
If there's no direct way to get them, I could compute them from the current matrix3d
if I knew it. The transform applied typically looks something like
rotateY(40deg) translateZ(-450px) translateY(43.959403439996905px)
and this is what is returned when I read element.style.webkitTransform
. However, Computed Style in the Chrome dev tools explicitly give it as e.g.
-webkit-transform: matrix3d(0.07660444431189782, 0, -0.06427876096865393, 0,
0, 0.1, 0, 0, 0.6427876096865393, 0, 0.7660444431189781, 0,
-252.8460175498463, 39.09830093383789, -222.5671108990365, 1);
which makes me think that there might just be a way somewhere in there to get the whole matrix programmatically even if the transform
was not specified in that way.
This is only for fun and learning so anything Webkit/Chrome-specific is fine.