I have this code to show a map using the Virtual Earth API:
<script type="text/javascript">
function GetMap() {
var map = map = new VEMap('myMap');
map.LoadMap(new VELatLong(47.6, -122.33), 10, 'h', false);
}
$(document).ready(function() {
GetMap();
});
</script>
<a href="#" onclick="$('#myMap').toggle();">Show Map</a>
<div id="myMap" style="position:relative; width:400px; height:400px; display:none;"></div>
This doesn't work, and displays a black box where the map should go. If I remove the "display:none;" style then it works just fine. But I don't want the map to be visible when the page loads, I want the user to toggle it. Can anyone see anything wrong with my approach?