jMaps

This example shows you how easily jQuery + jMaps makes dynamic, resizable maps.

The below example shows the new CheckResize function which will refresh the map for you.

Example: Resize and toogle display of map.

Toogle Map Display | Size: 100x100 | Size: 300x300 | Size: 600x600
                        
jQuery(document).ready(function(){
	jQuery('#map1').jmap('init', {'mapType':G_HYBRID_MAP,'mapCenter':[40.736216,-74.193393]});
	
	jQuery('.toggle-map').toggle(function(){
		jQuery('#map1').fadeOut(function(){
			jQuery(this).jmap('CheckResize');
		});
	}, function(){
		jQuery('#map1').fadeIn(function(){
			jQuery(this).jmap('CheckResize');
		});
	});
	
	jQuery('.resize').click(function(){
		var size = jQuery(this).attr('rel') + 'px';
		jQuery('#map1').animate({'width': size, 'height': size}, function(){
			jQuery(this).jmap('CheckResize');
		});
	});
});