解決策としては位置がずれる要素、もしくはその子要素をずれた後になんらかの形で再度レンダリングさせればいい。
例えば img 要素がずれる場合には、以下のように、自分の幅を取得して、おおよそ要素がずれる時間分遅延をかけて、再度自身の幅をセットする。
そうすれば見た目には変化がないが、ブラウザ自身はレンダリングを行うので、要素の位置が再計算されてずれが解消される。
$("img").click(function () {
var w = $(this).attr("width");
$(this).delay(1000).attr("width",w);
});
※上記の例は jQuery を使用しています。
どうやら CSS の変更はお気に召さないらしく、 HTML のレンダリングに関わるなんらかの要素を変化させないといけないらしい。
珍しく2本続けての実用ネタ。
このテのはなしはだいたいググったらでてくるんですけど、今回は見つけられなかったので、メモ。