How do I identify if the scale of the div being animated increased using javascript

Asked

Viewed 37 times

-2

<html>
<style>
#dv{
border:1px solid red;
background:#344;
width:80px;
height:80px;
animation:bloco 0.5s ease 1;

}
@keyframes bloco{
from{transform:scale(0.0)}to {transform:scale(0.6)}

}

}
</style>
<body>
<div id = "dv"></div>
<script>
var pegar = document.getElementById("dv");
pegar.style.transform = "scale(0,0)";

if(pegar.style.scale == 0.0){
alert(scale);
}



</script>
</body>
</html>

inserir a descrição da imagem aqui

javascript html css

1 answer

0

The condition has to be called in a loop to check the Transform value.

setInterval(function() {
    var pegar = document.getElementById("dv");
    var transform = window.getComputedStyle(pegar).transform;
    var values = transform.split('(')[1];
    values = values.split(')')[0];
    values = values.split(',');

    if (values[0] > 0.5) {
        alert(values[0]);
    }

}, 100);

Browser other questions tagged javascript html css

You are not signed in. Login or sign up in order to post.