У меня есть элемент DOM, который я перевелX() в какую-то новую позицию.firefox css3 переводить на элемент с переполнением скрытый элемент исчезает
В Firefox этот элемент исчезает, как только происходит перевод. После много отладки кажется, что это происходит только тогда, когда перевод применяется динамически к элементу через какое-либо действие после того, как элемент был первоначально отображен (это не происходит, если css находится из загрузки страницы), и только когда значение translateX равно больше ширины элемента! Также это происходит только в том случае, если элемент dom имеет «переполнение: скрытое».
Так что, если у меня есть 200px ящик:
#box { width: 200px; overflow: hidden; }
Если я перевести на 199px, она прекрасно работает:
$('#box').css('transform', 'translateX(199px)')
Но если перевести на 200px, коробка переходит на свой новый положение, а затем через секунду исчезает
$('#box').css('transform', 'translateX(200px)')
Вот jsfiddle: http://jsfiddle.net/vtkmZ/3/
- Firefox только
- только если элемент дом имеет переполнения: скрытый
- Только если перевести применяется динамически после первого рендеринга
- только если значение translateX() больше, чем ширина элемента
Это происходит последовательно. Любые идеи о том, почему это происходит, и какие-либо обходные пути? Я не смог найти что-либо в Интернете. Это известная ошибка?
проверки по этой ссылке: http://stackoverflow.com/questions/15405054/firefox-mobile -element-animated-with-translate3d-flow-out-from-parent-containse – user1386213
Я не вижу разницы в поведении между Mac Chrome 36.0, Safari 7.0 и Firefox 30.0. – jtheletter