2

我的 div 结构如下：

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

编辑：

抱歉，我忘记了结构的几个重要部分。

head，graphData并且graph都将其min-heights设置为 300px。

我的问题是，当min-height 增加或减少时，如何更改head和graph'smin-height 以匹配min-height？有什么方法可以通过 jQuery 或 javascript 检测 css 样式更改？graphData'sgraphData's

由于我的数据库中动态生成的行，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

在 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 事件，但我会寻找样式属性修改事件，不确定是否存在）。

当对图表的更改触发时，处理头部 div。

于 2012-07-08T10:25:22.490 回答
1

你可以使用这个插件http://benalman.com/projects/jquery-resize-plugin/

于 2012-07-08T10:29:17.460 回答
0

您可以并排设置，也可以设置min-height: inherit为内部 div。

于 2012-07-08T10:23:49.880 回答