0

有線の問題に直面しています。ブートストラップを使用して、次のようなレイアウトをコーディングしました。

<div class="row-fluid">
    <div class="span4" id="block1">Some short text</div>
    <div class="span4" id="block2">Some LONG text<br/>displayed on<br/>multiple lines</div>
    <div class="span4" id="block3">Some short text</div>
</div>

私のカスタム CSS はいくつかの装飾を追加し、それぞれ.span*に境界線 (境界線、影など) が表示されます。その結果、はおよび#block2よりも背が高くなります。それぞれのすべてを解析し、それぞれの高さが同じになるように高さを調整する関数をコーディングしました。ここまでは、すべて正常に動作します。#block1#block3autoAlign().span*.row-fluid$(this).css('height', value).span*.row-fluid

私のプロジェクトでは、次のようなものがあります。

<div class="row-fluid">
    <div class="span8" id="left">Some VERY LONG text<br />...<br />...</div>
    <div class="span4" id="right">
        <div class="row-fluid">
             <div class="span12">Some fields</div>
        </div>
        <div class="row-fluid">
             <div class="span12" id="graph"></div>
        </div>
    </div>
</div>

Here #leftis taller than #rightand, functionで呼び出しautoAlign()#right同じ高さにし、jqplot#leftでグラフを描画します。チャートができるだけ多くの高さを使用するために、jqplotでチャートを描画する前に#graph高さを変更する必要があります。#graph

私の問題は、各要素に追加されていることを確認できても、ブラウザー (ここでは Chrome 27) で行われた調整がautoAlign()すぐに考慮されないことです。その結果、いずれかの高さにアクセスしようとした場合、または現在の高さを取得しようとすると (つまり、考慮せずに)、この要素を残りのすべての要素に合わせるために必要なサイズを計算できません。のスペース。CSS の変更は、関数を終了するときに画面にのみ適用されますstyle="height: NNNpx".span*#right$('#right').height()$('#right').css('height')style="height: NNNpx"#graph#right

だから、私の質問は次のとおりです: 最近の CSS の変更を強制的に再描画/適用する方法はありますか?

ありがとう。

4

0 に答える 0