Здравствуйте, я сделал маленькою анимацию
<!DOCTYPE html>
<body>
<div id="myDiv" onclick="myClick()"></div>
</body>
<style>
#myDiv {
width: 20vmin;
height: 20vmin;
background: green;
transition: height 1s ease;
}
#myDiv:active {
background: blue;
}
</style>
<script>
function myClick() {
document.getElementById("myDiv").style.height = Math.floor(Math.random() * 100) + "vmin";
}
</script>
</html>
При клике квадратик с анимацией изменит высоту, но он также анимируется при изменении размера окна/масштаба. Как сделать так чтоб он анимировался только при клике, а в остальных случаях просто менял размеры (без анимации)