等高箱+观察布局变化

时间:2011-06-24 12:10:10

标签: javascript css layout height

我应该选择哪种方式观察网站上的布局变化?

我在两个内容框中使用jQuery EqualHeight插件,在第一个框上使用border-right来划分它们。 如果右框的高度较高,则边框不适合,这就是我使用EqualHeight jQuery的原因。

到目前为止一直很好......

如果右侧框的大小发生变化,可能是因为手风琴或显示/高度效果,左框的高度以及边框/分隔线保持不变。

那么观察布局变化的最简单方法是什么,而不调用显式动作的相等高度函数(如show / hide toggles)?

我应该使用计时器来检查布局更改的常规并执行该功能还是会降低性能?

作为旁注,我可以使用表格或display:table来模仿表格行为,但这有点差。我尝试了Flexbox CSS规则,它很棒(实验性/不支持)。 因此,作为简单的后备,我喜欢通过JS

设置相同的高度

1 个答案:

答案 0 :(得分:1)

最简单的方法是了解这些布局何时发生变化。这不是一个随机的时间,总有一种方式可以说:“嘿,现在它已经改变了。”

最简单的方法是使用jQuery函数来更改布局并使用事件结构。例如,在发生更改时发送自定义事件。其他元素现在可以适应。

关于jQuery的好处是几乎每个函数都有回调。在完成一些动画时使用回调将自定义事件发送到其他元素,以便他们可以调整高度。