X() を新しい位置に変換する DOM 要素があります。
Firefox では、この要素は翻訳が行われるとすぐに消えます。多くのデバッグの後、これは、要素が最初にレンダリングされた後 (CSS がページの読み込みからそこにある場合は発生しません)、translateX 値が要素の幅を超えています! また、これは dom 要素に「overflow: hidden」がある場合にのみ発生します。
したがって、200px のボックスがある場合:
#box { width: 200px; overflow: hidden; }
199px に変換すると、完全に機能します。
$('#box').css('transform', 'translateX(199px)')
しかし、200px に変換すると、ボックスが新しい位置に移動し、1 秒後に消えます。
$('#box').css('transform', 'translateX(200px)')
ここに jsfiddle があります: http://jsfiddle.net/vtkmZ/3/
- Firefox のみ
- dom 要素に overflow: hidden がある場合のみ
- 最初のレンダリング後に変換が動的に適用される場合のみ
- translateX() の値が要素の幅より大きい場合のみ
これは一貫して発生します。なぜこれが起こっているのか、そして回避策はありますか？私はオンラインで何も見つけることができませんでした。これは既知のバグですか?