2

在我从几个同事那里得到一些帮助后，建议解决我的问题： DIV“100%”高度，从顶部 DIV 延伸到底部页脚以适应背景 是 JavaScript / jQuery，我在网上找到了一些东西：

http://nicholasbarger.com/2011/08/04/jquery-makes-100-height-so-much-easier/

但是，我需要一些定制。目前它做了我需要它做的事情。当我有一点内容时，它会将我的 DIV 推到浏览器的整个高度。

但是当我有更多内容时，内容会继续，但 DIV 不会扩展。

如何自定义以下脚本，以便它检测到是否有足够的内容不需要调整高度？ 

<script>
//Initial load of page
$(document).ready(sizeContent);

//Every resize of window
$(window).resize(sizeContent);

//Dynamically assign height
function sizeContent() {
    var newHeight = $("html").height() - $("#header").height() - $("#content-header").height()- $("#footer-wrapper").height() + 6 + "px";
    $("#content").css("height", newHeight);
}
</script>
4

1 回答 1

0 
function sizeContent() {
    var html = $("html").height(),
        content = $("#content").height(),
        header = $("#header").height(),
        contentHeader = $("#content-header").height(),
        footerWrapper = $("#footer-wrapper").height(),
        availableSpace = html - header - contentHeader - footerWrapper;

    if (content < availableSpace) {
        $("#content").css("height", availableSpace + 6 + "px");
    }
}
于 2012-05-19T17:56:23.100 回答