jquery - ページ位置に対するjQueryポップアップボックスの高さの配置

Question

現在、リンクをクリックすると表示されるボックスのポップがあります。私が抱えている問題は、リンクがページの半分ほど下にあり、リンクをクリックするとオーバーレイの高さが 100% ではなく、ボックスがページの上から 80 ピクセル下に表示されることです。私はどういうわけか、ページを作成するサイズに関係なくボックスオーバーレイの高さを100％にしたい（幅が機能するのと同じ）ボックスを持っているので、その時点でページに表示できるものに対して画面の上から80pxになりますページが最初にロードされたときではなく。

これが私が現在持っているコードです：

      //Popup dialog
      function popup(message) {

     // get the screen height and width  
     var maskHeight = $(document).height();  
     var maskWidth = $(window).width();

     // calculate the values for center alignment    
     var dialogLeft = (maskWidth/2) - ($('#dialog-box').width())/2; 

     // Set overlay to fill screen
     $("#dialog-overlay").css("width","100%").fadeIn();

     // Set dialogue box 80px from top and central
     $('#dialog-box').css({top:80, left:dialogLeft}).fadeIn();

     // display the message
     //$('#dialog-message').html(message);

     // Close button fades out overlay and message  
     $('.button').live('click',function()
     {
    $(this).parent().fadeOut();
    $('#dialog-overlay').fadeOut();
    return false;
     });

     window.onresize = function() {
     var maskWidth = $(window).width();
          var dialogLeft = (maskWidth/2) - ($('#dialog-box').width())/2; 
     $('#dialog-box').css({top:80, left:dialogLeft});
     }

 }

私が求めていた効果のためにコーディングしたオプション:

 //Popup about location box
 function popup(message) {

// get the screen height and width  
var maskHeight = $(document).height();  
var maskWidth = $(window).width();

// calculate the values for center alignment     
var dialogLeft = (maskWidth/2) - ($('#dialog-box').width()/2); 
var dialogTop = (maskHeight/2) - ($('#dialog-box').height()/2);

// Set overlay to fill screen
$("#dialog-overlay").css("width","100%").fadeIn();
$("#dialog-overlay").css("height",maskHeight).fadeIn();

// Set dialogue box 80px from top and central
$('html, body').animate({ scrollTop: 0 }, 500);
$('#dialog-box').css({top:80, left:dialogLeft}).delay(500).fadeIn();

// display the message
//$('#dialog-message').html(message);

// Close button fades out overlay and message   
$('.button').live('click',function()
{
    $(this).parent().fadeOut();
    $('#dialog-overlay').fadeOut();
    return false;
});

window.onresize = function() {
     var maskWidth = $(window).width();
     var dialogLeft = (maskWidth/2) - ($('#dialog-box').width())/2; 
     $('#dialog-box').css({top:80, left:dialogLeft});
}

 }