絶対配置要素の高さの計算

Question

絶対配置要素の高さの読み取りに問題があります。

私の主な目標は、ページ全体を埋めるために黒い背景をフェードインします別のDIVを設定することですが、私はどこにも行かないのです...

私はdocument.body.scrollWidthを試してみましたが、それは唯一のローディング段階の始まりで動作します。メインのDIVがロードされると、フェーディングよりも多くのスペースが必要になります。また、フェーディングDIV要素で満たされていないスペースが下部にあります。

誰かが助けることができますか？ここで

div#main_theater{ 
    position: absolute; 
    left: 80px; 
    top: 0; 
    background-color: #EEE4B9; 
    width: 940px; 
    opacity: 1; 
    z-index: 100; 
} 
div#blackOut{ 
    position: absolute; 
    text-align: center; 
    top: 0; 
    left: 0; 
    background-color: #000; 
    width: 100%; 
    z-index: 10; 
    color: #fff; 
    opacity: .7; 
} 

（スタートで）働いている：

var picHeight = document.body.scrollWidth; 
blackOut = document.createElement('div'); 
blackOut.setAttribute('id','blackOut'); 
blackOut.style.height = picHeight + 'px'; 

そして、PHPスクリプトへのAJAX呼び出しの後、私は、ウィンドウの新しいサイズを取得します。新しいサイズはdiv#main_theaterで大きく、古いサイズはdiv#blackOutです。

if(document.getElementById('main_theater')){  
    blackOut.style.height = document.getElementById('main_theater').style.height; 
} 

AJAXコールが終了すると、div#main_theaterは前回の身長よりも大きくなります。また、私はAJAX呼び出しの後に、AJAX呼び出しの後にscrollHeight/offsetHeightを読み込もうとしましたが、数字は以前と同じです（？）...

EDIT：AJAX responseTextは文書を読み込みますが、 JSのコマンドは、イメージロード時に実際のドキュメントサイズを取得するには速すぎます。私の意見では、画像が短時間で読み込まれているわけではないので、文書のサイズを正しく読み取ることができません。

Answer 1

固定の位置付けだけではなく、このようなもの：

<style> 
div#totaldude { 
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    z-index: 100; 
    background: black; 
    opacity: 0; 
} 
</style> 

<script> 
    $("body").append("div id='totaldude'></div>"); 
    $("#totaldude").fadeTo("fast", 0.5); 
</script>