Question

我必须为相对定位的div设置自动高度，其中包含多个绝对位置div。在没有提到相对于外部div的高度的情况下，由于overflow：hidden属性，绝对div内的内容是不可见的。

是否有任何Javascript可以实现这一目标..如果是这样，请告诉我。

提前致谢。

Answer 1

由于绝对定位子项不会影响父项大小，因此应手动计算父div的边界。例如，要获得父级的高度，您应该遍历子元素并找到子级顶部加上高度的最大值，并且为了获得宽度，您应该找到最大左侧和宽度对。您可以使用以下函数将父级宽度调整为高度：

function setSize() {
  var i, count,
      maxWidth = 0,
      maxHeight = 0,
      top, left, width, height,
      parent = document.getElementById('parent');

  for(i=0,count=parent.childNodes.length;i<count;i++) {
    if(parent.childNodes[i].nodeType === 1) {
      top = parent.childNodes[i].offsetTop;
      left = parent.childNodes[i].offsetLeft;
      width = parent.childNodes[i].offsetWidth;
      height = parent.childNodes[i].offsetHeight;
      if(top + height > maxHeight) {
        maxHeight = top + height;
      }
      if(left + width > maxWidth) {
        maxWidth = left + width;
      }
    }
  }
  parent.style.width = maxWidth + 'px';
  parent.style.height = maxHeight + 'px';
}

该函数假定您的父div具有id="parent"

您可以在此处找到工作示例：http://jsbin.com/ifelur/1/edit

如何为包含多个绝对div的相对定位div设置动态高度

1 个答案: