CSS3トランスフォームは要素の左の位置を変更しませんか？

次のCSSコードを使用して要素の左の位置が変更されない理由を説明できますか？CSS3トランスフォームは要素の左の位置を変更しませんか？

element { 
-webkit-transform:translate3d(200px,0,0); 
}

これは、異なる方法で同じことを行いますが、左の位置を変更：

element { 
position:absolute; 
left:200px; 
}

IモバイルサファリにハードウェアアクセラレーションをトリガするCSS3遷移と組み合わせた最初の方法を選択しました。

EDIT いくつかの明確化：それは変更に左の位置を変えるように見えますが、あなたはJavascriptで左の位置を取得したい場合には、報告の位置を変更しない（翻訳別名）0

出典

2011-01-13 DADU

作品のために調整していることを指摘http://jsfiddle.net/baXDz/ – Duopixel

ええと、移行は動作しますが、変換が完了した後にjavascript alert（element.style.left）で左の位置を取得しようとすると、ちょうど0になります。 – DADU

位置変換を返します。これは正しい動作です。要素を変換するときは、左/右のプロパティ（または他のプロパティ）に反映されないnew local coordinate systemを作成します。これは、ページの残りの部分が元の位置に残っているからです（別名 - 要素は、新しい位置を反映するためにページがリフローしません）。これは、scales.skewsなどについて考えるときに意味があります。他のものは、変換で行うことができます。

更新：あなたは重い物を持ち上げるを行いたい場合は、現在適用されている変換行列がwindow.getComputedStyleが（）を経由して報告され

更新：誰かがgetBoundingBoxが正しく変換や翻訳

出典

2011-01-13 18:57:24

CSS3トランスフォームは要素の左の位置を変更しませんか？

答えて

関連する問題