0

我需要调整容器 div 的高度，以便在内容太短时将页脚保持在窗口底部 onload 和 onresize 但如果内容将页脚推开则不会。我尝试了 css min-height:100% 的变体，但它不起作用。我已经设法让它在负载上工作：

<div class="header></div>
<script>
 var h = window.innerHeight-205;
 document.write('<div id="container" class="container" style="min-height: ' + h + 'px;">');
</script>
  ....content of container....
</div>
<div class="footer"></div>

但是当窗口调整大小时，我的页脚最终会出现在页面中间或页面外。我试过调用一个调整大小的函数，但似乎从来没有让它重置高度。我尝试的代码是：

function resetHeight () {
var h = window.innerHeight-205;
document.getElementById("container").setAttribute("height",h);
}

和

function resetHeight () {
var h = window.innerHeight-205;
document.getElementById("container").height = h;
}

我试图只使用 javascript 和 css，而不是 jquery。我对 JS 不太熟悉，所以如果我缺少使函数调用起作用的东西，请告诉我！我不关心旧浏览器，只关心 IE9+ 等，当用户旋转屏幕时，它也需要在 iPad 上运行......

任何帮助将不胜感激！

4

1 回答 1

0

尝试使用 css 方法，就像这里概述的那样： http ://www.cssstickyfooter.com/

于 2013-09-20T21:15:37.550 回答