2

私は次のように構造化されたdivを持っています:

<div id='head'>
    <div class='graphData'>
        <table>...</table>
    </div>
    <div class='graph'>...</div>
</div>

編集

申し訳ありませんが、構造のいくつかの重要な部分を忘れていました。

head、すべて300px に設定されてgraphDataいます。graphmin-heights

私の問題は、 min-height が増減したときにmin-height を min-heightheadgraph's一致するように変更するにはどうすればよいですか? jQueryまたはjavascriptを介してcssスタイルの変更を検出する方法はありますか?graphData'sgraphData's

DB から動的に生成された行が原因で、graphData の高さが変わります。

4

5 に答える 5

3

CSS や jQuery には、この性質の変化を検出する組み込みの方法はありません。あなたが考えているのは、要素の高さを定期的にチェックし、それらを最後の既知の値と比較することです。違いがある場合、それは高さが変わったことを意味します。

var oldHeight = $("#graph").height();

var heightChangeTimer = setInterval(function(){
  var newHeight = $("#graph").height();
  if (newHeight != oldHeight){
   oldHeight = newHeight;
   // do some actions on height change...
  }
},100);

今のところ、間隔を 100 ミリ秒ごとに設定しましたが、必要に応じてその値を微調整できます。IE を少し小さくすることもできます。より頻繁にチェックを実行します...

于 2012-07-08T10:22:14.820 に答える
1

このプラグインを使用できますhttp://benalman.com/projects/jquery-resize-plugin/

于 2012-07-08T10:29:17.460 に答える
1

CSS には実際のイベント システムはありません (まあ、jQuery にはあります)。グラフ要素がどのように変化しているかによって異なります。ユーザーが要素を操作したときに高さが変化する場合は、jQuery のクリック機能を使用できます。

$("#myElement").click(function() {
  $("#head").addClass("higher"); // change height or something
});
于 2012-07-08T10:24:58.367 に答える
1

jQuery:DOMの変更をリッスンする方法は?

あなたはおそらくこれを読みたいと思うでしょう。

基本的に、あなたがやりたいと思うことは、イベントリスナーをグラフの div にバインドすることです (ドキュメントは待機し、発生するイベントをリッスンします)。リッスンする必要があるイベントは、CSS の変更です (DOMSubtreeModified イベントの可能性がありますが、スタイル属性の変更イベントが存在するかどうかはわかりません)。

グラフへの変更が発生したら、head div を処理します。

于 2012-07-08T10:25:22.490 に答える
0

並べて設定min-height: inheritすることも、内側のdivに設定することもできます。

于 2012-07-08T10:23:49.880 に答える