function getElById(id)
  {return document.getElementById(id);}
  
  $(document).ready(function() {

   //select all the a tag with name equal to modal
   $('a[name=modal]').click(function(e) {
      //Cancel the link behavior
      $("#u_id1").attr("value",$(this).attr("rel"));
	  $("#event_id1").attr("value",$(this).attr("rel"));
	  $("#job_id1").attr("value",$(this).attr("rel"));
      //Get the A tag
      var id = $(this).attr('href');

      //Get the screen height and width
      var maskHeight = $(document).height();
      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("fast",5.5);	

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

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

   });

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

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