0

簡単な質問ですが、スクロールバーを含めてビューポートの高さと幅の 100% になるようにページ オーバーレイ (半透明の黒いカバー) を設定するにはどうすればよいですか?

私はすでに試しました：

body{
background-image:url(../pictures/background2.png);
background-position:top;
background-size:100% 100%;
background-repeat:no-repeat;
margin:0;
border:0;
height:100%;
}

/*Loading*/
#loadingoverlay {
position: absolute;
height: 100%;
width: 100%;
background-color: rgba(0,0,0,0.7);
filter:alpha(opacity = 80);
top:0;
bottom:0;
z-index:99;
}

スクロールバーのないビューポートのみをカバーします。言い換えれば、下にスクロールした瞬間、1 画面の高さより下のコンテンツはオーバーレイで覆われません。

明らかに、これも機能しません:

/*Loading*/
#loadingoverlay {
position: absolute;
height:9999px;
width:9999px;
background-color: rgba(0,0,0,0.7);
filter:alpha(opacity = 80);
top:0;
bottom:0;
z-index:99;
}

これは、ビューポートを 9999x9999 に拡大するだけです。

4

1 に答える 1

0

スクロールバーは「ビューポート」の一部ではありません。あなたはスタイルであり、JavaScriptはビューポート上にドメインを持っていますが、スクロールバーにはありません。スクロール バーをオフにすることはできますが、その上にオーバーレイを表示することはできません。ウィンドウなしの Flash を実行することは可能ですが、それはあなたが望む実装ではありません。

于 2013-03-18T19:24:02.090 に答える