webkit-transform заменяет порядок z-индекса в Chrome 13

Обновление

Приносим извинения за то, что не смогли добавить незначительные детали, которые мы также накладываем на множество элементов div поверх друг друга с z-индексом . После дополнительной работы с этой проблемой кажется, что webkit-transform на самом деле мешает упорядочиванию z-index , и что реальная проблема не связана с самими анимациями.

] Конец обновления

В настоящее время я работаю над проектом, в котором мы разрабатываем приложение, которое довольно сильно зависит от анимации CSS3. Мы анимируем множество элементов div с помощью -webkit-transform и -webkit-transition .

Все хорошо, до сегодняшнего дня, когда все анимируемых элементов страницы исчезли. Похоже, что Google Chrome обновился с 12.xx до 13.0.782.107m , и теперь, внезапно, свойства CSS3 с префиксами -webkit перестали работает, а элементы, к которым применено это свойство, больше не отображаются. Удаление свойства -webkit-transform через отладчик Chrome делает элементы снова видимыми.

Кто-нибудь еще испытывал те же проблемы или знает, как решить эту проблему?

Я могу добавить, что я мы попытались удалить только префиксы -webkit (оставив только transform ), который затем показывает недостающие элементы, но тогда это не будет анимировать элементы вообще, как CSS3 свойство преобразование не поддерживается.

Я также пробовал использовать el.style.webkitTransform и el.style.WebkitTransform , но безуспешно.

] Передам пример кода для объяснения. Желаемый результат - удалить sq1 и открыть sq2 .

HTML:
<div id="sq1" style="z-index:10;">
<div id="sq2" style="z-index:5;">

JS
/* fetch the element */
var el = document.getElementById("sq1");
/* apply CSS */
el.style["-webkit-transition"] = "-webkit-transform 500ms linear";
el.style["-webkit-transform"] = "translate3d(30px, 30px, 0px)";
31
задан Jason 14 August 2012 в 20:08
поделиться