Javascript 自动将div高度调整为窗口大小，但不小于子窗口大小

在以下问题上，我需要一些帮助。我得到的是一个相当基本的单页网站。简而言之，它的结构看起来很像这样：

<div class="full_height" id="home">
  <div class="container">
    <div class="row">
      <div class="span8">
        CONTENT GOES HERE
      </div>
    </div>
  </div>
</div>

$(window).on("resize load", resizeWindow);function resizeWindow( e ) {
  var newWindowHeight = $(window).height()-160;

  var idSelector = ["home","second","third","fourth","fifth"];

  for (var i = 0; i < idSelector.length; i++) {
    var element = document.getElementById(idSelector[i])

    if( element.offsetHeight < element.scrollHeight){
      $("#"+idSelector[i]).css("height", "auto" );
    }
    else{
      $("#"+idSelector[i]).css("height", newWindowHeight );
    } 
  }
}

内容在这里

这个div结构重复5次，具有连续的id[主、第二、第三、第四、第五]。我遇到的问题是，我希望.full_高度的容器在加载站点时与窗口大小相同，并在调整大小时随窗口大小一起调整大小。此外，div的大小永远不应该比它的孩子小

我当前的尝试如下所示：

<div class="full_height" id="home">
  <div class="container">
    <div class="row">
      <div class="span8">
        CONTENT GOES HERE
      </div>
    </div>
  </div>
</div>

$(window).on("resize load", resizeWindow);function resizeWindow( e ) {
  var newWindowHeight = $(window).height()-160;

  var idSelector = ["home","second","third","fourth","fifth"];

  for (var i = 0; i < idSelector.length; i++) {
    var element = document.getElementById(idSelector[i])

    if( element.offsetHeight < element.scrollHeight){
      $("#"+idSelector[i]).css("height", "auto" );
    }
    else{
      $("#"+idSelector[i]).css("height", newWindowHeight );
    } 
  }
}

$（窗口）。打开（“调整加载大小”，调整窗口大小）；函数大小调整窗口（e）{
var newWindowHeight=$（window）.height（）-160；
var idSelector=[“主”、“第二”、“第三”、“第四”、“第五”]；
对于（变量i=0；i

现在，上面的脚本有点像我在寻找的，但是有一些hickup

i） 加载站点后，它仅将div高度调整为窗口大小，不符合儿童要求。它仅在调整窗口大小时执行此操作

ii）调整窗口大小时，div height将在“自动”和窗口大小之间来回闪烁。根据您何时停止调整大小，它将采用两种尺寸中的任何一种作为其高度

---

有什么想法吗？

您需要从HTML树的100%高度开始：

html, body, #full_height {
    height:100%;
}

---

您是否考虑过使用宽度：XXX%；他们呢？