$(window).resize(function() {
        if ( $('#mask') ) {
            if ( $('#mask').is(":visible") ) {
                ShowMask();
            }
        }
    });
    
    function SetOpacity(selector, opacity) {
        if ( $.browser.msie ) {
            $(selector).css('filter', 'alpha(opacity='+opacity*100+')');
        } else {
            $(selector).css('opacity', opacity);
        }
    }
    function ShowMask() {
        var maskHeight = $(document).height();
        var maskWidth = $(document).width();
    
        //Set height and width to mask to fill up the whole screen
        $('#mask').css({'width':maskWidth,'height':maskHeight});
        
        //transition effect        
        //$('#mask').fadeIn("slow");
        SetOpacity("#mask", .5);
        $('#mask').show();
    }
    function HideMask() {
        $('#mask').hide();
    }
    function CloseModalBox(selector) {
        $(selector + ' .window').hide();
        HideMask();
    }
    function DisplayModalBox(selector) {
       //Get the screen height and width
      
       //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();
        
        var Scroll = getScrollXY();
              
        //Set the popup window to center
        var top = winH/2-$(selector).height()/2;
        if (top < 0) {
            top = 0;
        }
        $(selector).css('top', top + Scroll[1] );
        $(selector).css('left', winW/2-$(selector).width()/2);
    
        //transition effect
        $(selector).fadeIn(1000);
        
        ShowMask();
       
        $(window).resize(function() {
             var winH = $(window).height();
             var winW = $(window).width();
             var top = winH/2-$(selector).height()/2;
             if (top < 0) {
                top = 0;
             }        
             $(selector).css('top',  top+ window.scrollY);
             $(selector).css('left', winW/2-$(selector).width()/2);
        });
    }
    function DisplayModalBoxFromUrl(url, target_selector) {
        $.get(url, function(data){
            $(target_selector).html(data);
            DisplayModalBox(target_selector + ' .window');

        });

    }
    
    function DisplayModalBoxFromUrlPost(url, params, target_selector, onload) {
        $.post(url, params, function(data){
            $(target_selector).html(data);
            
            DisplayModalBox(target_selector + ' .window');
            
            if ( typeof onload == 'function' ) {
                onload();
            }    
        });
    }
    
function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}