Get scale el jquery

Issue

Can you please advise me how I can take the scale value of an element using jquery?

var scale = $("div").css("scale");
console.log(scale);

div {
  width: 100px;
  height: 100px;
  scale: 0.5;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>TEST</div>

Solution

This works fine in any browser that is running the following (minimum) versions:

Chrome	Edge	Firefox	Safari
104	104	72	14.1

I changed the ruleset for div to .test and gave your div the test class. It was causing the console to be rendered very small.

var scale = $("div").css("scale");

console.log(scale); // "0.5"

.test {
  scale: 0.5;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="test">TEST</div>

For more information on these rules, checkout this web.dev article:

"Finer grained control over CSS transforms with individual transform properties"

Answered By - Mr. Polywhirl