jasonsee/gist:3868714

## gistfile1.html

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0; padding-top: 97px; padding-bottom: 52px; overflow-x: hidden; overflow-y: hidden }
      #map_canvas {height: 100% }
      #content {margin: 0; padding: 0 }
    </style>
    <!-- LOAD JQUERY 1.7.2 BETA 1 -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2b1.js"></script>
    <script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCIm39N8LO15IQ8WyOSrLP-vFxqwcpnfFw&sensor=false">
    </script>
    <script type="text/javascript">
    function initialize() {
    	var myOptions = {
    	zoom: 12,
    	center: new google.maps.LatLng(44.358469,-80.102348),
    	mapTypeId: google.maps.MapTypeId.ROADMAP,
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var contentString = '<div id="content">'+
    '<div id="siteNotice">'+
    '</div>'+
    '<h2 id="firstHeading" class="firstHeading">The Creemore Echo</h2>'+
    '<div id="bodyContent">'+
    '<p>3 Caroline Street West</br>' +
    'Creemore, ON L0M 1G0</br>' +
    'P (705) 466-9906</br>' +
    'F (705) 466-9906</p>' +
    '<p><a href="http://goo.gl/maps/sVh7P">'+
    'Directions</a></p>'+
    '</div>'+
    '</div>';

    var infowindow = new google.maps.InfoWindow({
    content: contentString,
    });

    var marker = new google.maps.Marker({
    position: new google.maps.LatLng(44.326175, -80.10645),
    map: map,
    title: 'The Creemore Echo'
    });

    infowindow.open(map,marker);

    google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
    });

}

	google.maps.event.addDomListener(window, 'load', initialize);

</script>
<script type="text/javascript">
$(window).load(function(){
	$("#map_canvas").css({height: $(window).height() - 149});
});
</script>
<script type="text/javascript">
jQuery(document).ready(function($) {
	$(window).resize(function () {
		resizePanel();
	});
});
function resizePanel() {
	$("#map_canvas").css({height: $(window).height() - 149});
	return false;
}
</script>
    </head>
<body onload="initialize()">
	<div id="map_canvas" style="width:100%; height:100%">
	</div>
</body>
</html>

	<!DOCTYPE html>
	<html>
	<head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
	html { height: 100% }
	body { height: 100%; margin: 0; padding: 0; padding-top: 97px; padding-bottom: 52px; overflow-x: hidden; overflow-y: hidden }
	#map_canvas {height: 100% }
	#content {margin: 0; padding: 0 }
	</style>
	<!-- LOAD JQUERY 1.7.2 BETA 1 -->
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2b1.js"></script>
	<script type="text/javascript"
	src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCIm39N8LO15IQ8WyOSrLP-vFxqwcpnfFw&sensor=false">
	</script>
	<script type="text/javascript">
	function initialize() {
	var myOptions = {
	zoom: 12,
	center: new google.maps.LatLng(44.358469,-80.102348),
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	};

	var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

	var contentString = '<div id="content">'+
	'<div id="siteNotice">'+
	'</div>'+
	'<h2 id="firstHeading" class="firstHeading">The Creemore Echo</h2>'+
	'<div id="bodyContent">'+
	'<p>3 Caroline Street West</br>' +
	'Creemore, ON L0M 1G0</br>' +
	'P (705) 466-9906</br>' +
	'F (705) 466-9906</p>' +
	'<p><a href="http://goo.gl/maps/sVh7P">'+
	'Directions</a></p>'+
	'</div>'+
	'</div>';

	var infowindow = new google.maps.InfoWindow({
	content: contentString,
	});

	var marker = new google.maps.Marker({
	position: new google.maps.LatLng(44.326175, -80.10645),
	map: map,
	title: 'The Creemore Echo'
	});

	infowindow.open(map,marker);

	google.maps.event.addListener(marker, 'click', function() {
	infowindow.open(map,marker);
	});

	}

	google.maps.event.addDomListener(window, 'load', initialize);

	</script>
	<script type="text/javascript">
	$(window).load(function(){
	$("#map_canvas").css({height: $(window).height() - 149});
	});
	</script>
	<script type="text/javascript">
	jQuery(document).ready(function($) {
	$(window).resize(function () {
	resizePanel();
	});
	});
	function resizePanel() {
	$("#map_canvas").css({height: $(window).height() - 149});
	return false;
	}
	</script>
	</head>
	<body onload="initialize()">
	<div id="map_canvas" style="width:100%; height:100%">
	</div>
	</body>
	</html>