Saeed Adel Mehraban Saeed Adel Mehraban - 1 year ago 118
Javascript Question

get element dimensions regardless of rotation

Suppose we have a 50x100

, if we rotate it 45 degrees, jquery returns different values for width and height. If we rotate it again for 45 degrees, jquery returns 100 for width and 50 for height.

I'm looking for a way to get actual width and height regardless of rotation.

Note: actually the parent of my element has rotation, and I don't want to get involved with it's rotation. I'm not willing to use sin/cos with jquery width height to get original dimensions.

Answer Source

Since jQuery is an old library, it used some different combinations (of getBoundingClientRect, getComputedStyle, clientWidth/clientHeight and offsetWidth/offsetHeight (and also over the times.

So, without knowing your used version of jQuery, it's hard to say what it does internally.

At least getBoundingClientRect gives you the actual dimensions of transformed elements.

Here's a small test case:

I would bet that using clientWidth/clientHeight or offsetWidth/offsetHeight should give the correct values.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download