javascript - 動的サイズの画像の中心を設定

Question

JS を使用して、動的にサイズ変更された画像の中心の絶対 (x, y) 位置を設定できるようにしたいと考えています。これを可能にするCSSコンテナの配置が必要ですが、私はそれを理解することができませんでした. JS で計算されたオフセットを使用することもできますが、アニメーションのスケーリングがかなり複雑になるため、可能であれば避けたいと思います。

Answer 1

私は解決策を見つけたようです。

HTML:

<div id='parent'><div id='child'></div></div>

子 CSS:

transform: translate(-50%, -50%);    
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);

親に移動を設定すると、子がその中心で移動するようになりました。