javascript - Get the scale value of an element?

Question

I'm wondering how I can get the scale value of an element?

I have tried $(element).css('-webkit-transform'); which returns matrix(scaleX,0,0,scaleY,0,0); Is there a way of getting scaleX and scaleY only?

Answer 1

The simplest solution to find out the scale factor between the document and an element is the following:

var element = document.querySelector('...');
var scaleX = element.getBoundingClientRect().width / element.offsetWidth;

This works because getBoundingClientRect returns the actual dimension while offsetWidth/Height is the unscaled size.