@daugherty

Как сделать анимацию только при клике?

Я сделал небольшою анимацию:
<!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>

При клике квадратик с анимацией изменит высоту, но он также анимируется при изменении размера окна/масштаба. Как сделать так, чтобы он анимировался только при клике, а в остальных случаях просто менял размеры (без анимации)?
  • Вопрос задан
  • 125 просмотров
Пригласить эксперта
Ответы на вопрос 1
Exploding
@Exploding
wtf?
Наверно вынесите css-анимацию в отдельный класс, например .animate-1 и при клике по элементу переключайте наличие .animate-1 у #myDiv
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы