DOM要素のサイズや位置が変更されたときに、ポーリングなしで検出する方法はありますか？

Question

私は長い間、DOM要素のサイズや位置が変更されたときを検出する方法を探していました。ウィンドウのサイズが変更されたか、新しい子要素が要素に追加されたか、この要素の周りに新しい要素が追加されたか、またはCSS規則が変更されたか、ユーザーがブラウザのフォントサイズを変更したためです。要素のサイズや位置が変更される理由は非常に多くあります。

これらのイベントの多くでイベントハンドラをフックできますが、カバーされていないケースがあると思います。私はMutationObserversを使用して要素のoffsetWidthまたはclientWidthを監視することを望んでいましたが、DOM属性にのみ適用され、Nodeプロパティには当てはまりません（Webkitが実装するもの）。したがって、本当に防弾になるためには、とにかくポーリングループを実行する必要があるようです。

これは間違いありませんか？私は何か重要なことを忘れましたか？要素のサイズや位置が変更されたときを検出するためのポーリングは唯一の防御方法ですか？

編集

もう少し文脈を与えるために、これは、いずれか1つの特定のユースケースに関連付けられていません。私のために、それは時間と時間が再び来ている。私の現在の状況では、CSSを使って親の幅と高さを100％に設定したキャンバスを作成したいと考えていました。私は、キャンバスの幅と高さのプロパティをoffsetWidthまたはclientWidthが変更されたときに調整するスクリプトを望んでいます（これは幅と高さのプロパティがフレームバッファの解像度に影響を及ぼすWebGL用です）。別のプロジェクトでは、ユーザーのブラウザウィンドウ内に残っているスペースを埋めるために、要素を高さを広げたいと思っていました。私は再びこのような状況の時間と時間を越えてきたと、必然的に、解決策はあるように思わ：

1. あなたはそれがDOMを変更する場合があります書き込み任意のコードへ
2. フックをwindow.resizeに耳を傾ける（または多分使用します変異イベントや変更オブザーバー）
3. は、いずれかをクリーンアップするために定期的にポーリング動作は

例を逃した（ほとんどの人が1で停止し、多分2のほとんどない）

I私は何か重要なものを逃していないことを確認したかっただけです。

ちなみに、私のWebGLの状況では、window.resizeを聴くだけで十分です。キャンバスの寸法とレンダリングの解像度が同時に変わるため、やや好ましいです。

Answer 1

underflowとoverflowというイベントを使用するtechniqueに同僚が私に指摘しました。私はそれを試していない、と私はどのようなブラウザのサポート（クロムとFireFoxのように見えますが、ブラウザで探すだろう同じイベントを合成することでIEで動作するはずですが、私はどのバージョン技術をサポートする）。

Answer 2

あなたはCSSアニメーションでそれを行うことができます。 http://developer.streak.com/2012/11/how-to-detect-dom-changes-in-css.htmlなどをご覧ください。私はあなたのすべての要件を処理しないだろうと思うが、今ではそれをもう少し読んでいる。