<script>
$('#map').live("click",function(){
 $('#bodybg').show();
$('#MapOverlay').fadeIn() ;
return false ;
 }) ;
</script>

<div id="MapOverlay" class="MapOverlay">
   <input type="button" id="close_map" class="cross_img">
         <div class="backbg">
      .....</div></div>

<style>
 #MapOverlay {
         background:#fff;
         border:1px solid #80686f;
         border-radius:5px;
         -webkit-box-shadow: 0 8px 6px -6px #766A65;
     -moz-box-shadow: 0 8px 6px -6px #766A65;
      box-shadow: 0 8px 6px -6px #766A65;
          display:none;
          font-family:calibri;
          font-size:15px;
          left:30%;
          height : 400px ;
          width : 400px ;
          opacity:1;
          position:fixed;
          text-align:center;
          top:30%;
          z-index:109;
       }
    #bodybg{ background: none repeat scroll 0 0 #FFFFFF;
       border-radius: 5px 5px 5px 5px;
       text-align: left;
       z-index: 102;
      }
    #mapcanvas{
     border:1 px solid;
     width: 300px;
     height:300px;


               }
     </style>