我面临一个有线问题。使用引导程序,我编写了一些类似于此的布局:
<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
和#block3
。我编写了一个函数autoAlign()
,它解析每个.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>
这里#left
比#right
和高,在一个函数中,我调用autoAlign()
了与和#right
相同的高度#left
,然后#graph
用 jqplot 绘制图表。我需要在使用jqplot#graph
绘制图表之前更改高度,以便图表使用尽可能多的高度。
autoAlign()
我的问题是浏览器(此处为 Chrome 27)不会立即考虑所做的调整,即使我可以看到style="height: NNNpx"
已添加到每个.span*
元素。结果,如果我尝试访问 with 的高度,#right
或者$('#right').height()
我$('#right').css('height')
得到当前高度(即不style="height: NNNpx"
考虑),因此,我无法计算所需的大小#graph
,以便该元素能够容纳所有剩余的中的空间#right
。CSS 更改仅在退出功能时应用于屏幕
所以,我的问题如下:有没有办法强制浏览器重新绘制/应用最近的 CSS 更改?
谢谢。