IE: дочерний элемент теряет анимацию, когда родитель временно скрыт

После скрытия и отображения родительского элемента дочерний элемент больше не вращается (теряет анимацию css3).

Удаление анимации родительских элементов и выполнение hide/show не вызовет такой же проблемы (проблема возникает, когда родительский элемент также имеет анимацию)

Я тестировал в IE 11. Это известная проблема?

Вот фрагмент кода codenen (скопирован ниже) http://codepen.io/agirma/pen/byIEd

/*-------- CSS start ---------*/
@-webkit-keyframes show_content { from { -webkit-transform: scale(0); opacity:0; transform: scale(0); opacity:0; } to { -webkit-transform: scale(1); opacity:1; transform: scale(1); opacity:1; }
}
@keyframes show_content { from { -webkit-transform: scale(0); opacity:0; transform: scale(0); opacity:0; } to { -webkit-transform: scale(1); opacity:1; transform: scale(1); opacity:1; }
}
@-webkit-keyframes rotate_content { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes rotate_content { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
#parent { display:block; background:gray; width: 100px; height: 100px; padding: 20px; -webkit-animation: show_content 4s; -ms-animation: show_content 4s; amimation: show_content 4s;
}
#child { display:block; width:80px; height: 80px; border:solid 1px red; -webkit-animation: rotate_content 1s linear infinite; -ms-animation: rotate_content 1s linear infinite; amimation: rotate_content 1s linear infinite;
}
/*------------CSS end----------*/
<div id="parent">
</div>
<button onclick="toggleVisibility()">toggle display</button>
1 ответ

Я не считаю, что эта проблема "известна". Я нашел это сам пару недель назад, когда IE-тестирование webapp я строю. Я, наконец, добрался до сегодняшнего дня, и, заметив те же условия для появления, которые вы указали, я решил представить отчет об ошибке для IE. Я как раз собирался это сделать, когда нашел этот вопрос.

Мой отчет об ошибке:https://connect.microsoft.com/IE/feedbackdetail/view/941104/ie-11-bug-with-nested-css-animations-upon-display-of-previously-hidden-parent

Update: Ошибка была успешно воспроизведена инженерами Microsoft и будет исследована.

licensed under cc by-sa 3.0 with attribution.