JSフォントサイズ変更は、IE以外のブラウザでは徐々に動作しません

Question

divのフォントサイズを変更するまでjavascriptでフォントのサイズを変更しています。サイトのレイアウトが流動的でdivのサイズが変更されているためそれに応じてフォントを一致させます。

それは単純なループです：

while (!overflow(div)) { 
     fontSize += 1; 
     div.css("font-size", fontSize + "%"); 
    } 

不思議なことに、唯一のIEはそれを正しくありません。

Chrome、Firefox、Operaは、フォントサイズを直線的に調整するのではなく、不規則な間隔で調整します。

など。 Chromeはフォントサイズを108％、120％、129％に調整するだけで、その間のすべての値は無視されているようです。 MozとOperaには独自の間隔（小さいもの）があるので、そこで何が起こっているのか把握するのは容易ではありません。

誰かがアイデアを得ましたか？

Answer 1

WebKitベースのブラウザとFirefoxは、ページのレンダリング全体をより効率的にするために、DOMをタイムスタンプしてバッチ更新するように最適化されています。アイデアは、DOMへの複数の連続した更新は、個々のレンダリングを必要とすることはめったにありませんが、最後には1つのレンダリングだけが必要であるということです。しかし、まだレンダリングをトリガーする方法はあります。ブラウザに強制的にページのレイアウトを変更させるゲッターを呼び出すだけです。あなたのループ内で、スタイルプロパティを設定した後、各反復でレンダリングする引き金と付け加え

o = div.offsetWidth; 

。

Googleの技術者Tony GentilcoreのブログにあるWebKitに再レイアウトを引き起こすすべてのメソッドとゲッタープロパティのうち、a listがあります。