我有一个 DOM 元素，我将其 translateX() 到某个新位置。
在 Firefox 中，一旦发生翻译，该元素就会消失。经过大量调试后，似乎只有在通过某些操作将翻译动态应用于元素时，在元素最初呈现之后（如果页面加载时 CSS 存在，则不会发生）并且仅当 translateX 值是大于元素宽度！此外，仅当 dom 元素具有“溢出：隐藏”时才会发生这种情况。
所以，如果我有一个 200px 的盒子：
#box { width: 200px; overflow: hidden; }
如果我翻译成 199 像素，它会完美运行：
$('#box').css('transform', 'translateX(199px)')
但是如果我翻译成 200 像素，盒子会移动到它的新位置，然后一秒钟后它就消失了
$('#box').css('transform', 'translateX(200px)')
这是一个jsfiddle：http: //jsfiddle.net/vtkmZ/3/
- 仅限火狐
- 仅当 dom 元素有溢出时：隐藏
- 仅当在第一次渲染后动态应用翻译时
- 仅当 translateX() 值大于元素宽度时
这种情况始终如一地发生。关于为什么会发生这种情况的任何想法以及任何解决方法？我无法在网上找到任何东西。这是一个已知的错误？