Reputation: 1884
I'm trying to get the size of an HTML element after transforming/zooming using webkit or any other methods.
After zoomed in, the element takes more pixels that it took before transformation.
I tried .height() .width() .offsetHeight() .clientHeight()
all of them just returns same values after transforming the element.
Is there a way to get actual width and height of a element after transforming?
Upvotes: 0
Views: 1176
Reputation: 944
You can use getComputedStyle
to get effective styles on your element:
var matrix = new WebKitCSSMatrix(getComputedStyle($('#el')[0]).webkitTransform)
where $('#el')
is your element.
then matrix.a
and matrix.d
should give relevant scaling factors. After that, simply use $('#el').width()*matrix.a
and $('#el').height()*matrix.d
respectively
Upvotes: 1
Reputation: 19773
try outerHeight()
, outerWidth()
, outerHeight(true)
, outerWidth(true)
also try giving your browser a break before you measure by scheduling your code with setTimout(function() { /* do you measuring here */ }, 0);
Upvotes: 0