2

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.

Community
  • 1
  • 1
Gustav Barkefors
  • 5,016
  • 26
  • 30

0 Answers0