2

ここでの私の問題の解決策を提案する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 に答える