4

背景画像をメニュー div の下に配置する必要があります。したがって、body 要素に背景を適用する代わりに、body div を含む別の bg div を配置し、幅を 100% に設定します (body div には幅が指定されています)。bg div 内に背景を設定します。

テストしたところ、ドキュメントの長さが足りなかったため、背景画像の半分が表示されました。だから私はこれをJavaScriptで修正しようとしています。

<!DOCTYPE HTML>
.....
<script type="text/javascript" src="jquery-min.js"></script>
<script type="text/javascript">
function setDocumentSize() {
    alert($(window).height());
    alert($(document).height());
    if ($(window).height()>$(document).height()) {
        var height = $(window).height()-$(document).height();
        document.getElementById('bg').style.height=height+"px"
        }
    }
.....
</script>
.....
<body onload="setDocumentSize()">
<div class="menu">
.....
</div>
<div class="bg">
    <div class="body">
    .....(background in this div) 
    </div>
</div>

両方のアラートがビューポートの高さでポップアップするようになりました。したがって、何も起こりません。

Firefox 16.0.2 を使用しています

実際のページへのリンクは次のとおりですhttp://servapps.dyndns-work.com/abstract/

4

2 に答える 2