Google Maps Loaded in a hidden DIV - problem with checkResize();

I am loading a google map in a hidden DIV. If I click a span, the DIV shows up. This is my map Code:

<script type="text/javascript">
google.load("maps", "2.x");
function initialize() {
map = new GMap2(document.getElementById("map_sm"));
  var location = new GLatLng(50.72251, 10.44476);
  map.setCenter(new GLatLng(50.72251, 10.44476), 13);
  map.setUIToDefault();
  map.enableRotation();
  map.disableScrollWheelZoom();
  var开发者_运维知识库 marker = new GMarker(location);
  map.addOverlay(marker);
  map.checkResize();
}
google.setOnLoadCallback(initialize); 
</script>

And this is my js function to show the map:

<script>    
jQuery('#sm_map').click(function() {
        jQuery('body').css({'width':'100%','height':'100%','':'hidden'});
        jQuery('#overlay_sm').fadeIn();

    });

    jQuery('.overlay_close').click(function() {
               jQuery('.map_overlay').fadeOut();                                        
    });
</script>

Where do I have to add the checkResize() ? I tried it on many places but did not suceed.

Many Thanks in advance Theresa

checkResize doesn't actually check for a resize - it notifies the map that a resize has occurred. You need to check for the resize yourself:

$(document).resize(function(){
    map.checkResize();
});

You know GMaps V2 is deprecated, right?