Почему не срабатывает анимация для transform если её добавить с помощью js
Устал уже везде лазить искать, нигде ответа нет, не могу разобраться почему transform не работает:
var imageShip = document.createElement("img");
imageShip.src = "изобр_клиссана.jpg";
myTile.appendChild(изображениеКорабля);
imageShip.style.transition = "all 2s";
imageShip.style.transform = "rotate(100deg)";
Картинка то отображается уже повёрнутой, а вот анимация не проигрывается. Почему так происходит? Как управлять трансформациями css с помощью js? |
Mixeyka,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div id="myTile"></div>
<script>
var imageShip = document.createElement("img");
imageShip.onload = function() {
imageShip.style.transform = "rotate(100deg)";
}
imageShip.style.transition = "all 2s";
myTile.appendChild(imageShip);
imageShip.src = "http://www.stihi.ru/pics/2016/04/15/31.jpg";
</script>
</body>
</html>
|
рони, спасибо. Тоесть для запуска анимации нужен инициатор колбэк?
|
Цитата:
|
Ясно, спасибо.
|
| Часовой пояс GMT +3, время: 21:55. |