$(document).ready(function() {
 //Put in the DIV id you want to display
 //launchWindow('#dialog1');

 //if close button is clicked
 $('.window #close').click(function () {
 $('#mask').hide();
 $('.window').hide();
 });

 //if mask is clicked
 $('#mask').click(function () {
 $(this).hide();
 $('.window').hide();
 });

});

function launchWindow(id) {

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

 //Set heigth and width to mask to fill up the whole screen
 $('#mask').css({'width':maskWidth,'height':maskHeight});

 //transition effect
 $('#mask').fadeIn(1000);
 $('#mask').fadeTo("slow",0.8);

 //Get the window height and width
 var winH = $(window).height();
 var winW = $(window).width();

//Set the popup window to center
 $(id).css('top', 100);
 //$(id).css('top', winH/2-$(id).height());
 $(id).css('left', winW/2-$(id).width()/2);

 //transition effect
 $(id).fadeIn(2000);

}