我正在尝试制作一个按钮，将 googlemap div 变成全屏.. 这是我到目前为止所拥有的，但它无法正常工作.. 问题是: map 只会加载一半 代码如下，截图
我该如何修复这个问题？哪里有问题？ 提前致谢
http://img32.imageshack.us/img32/9365/halfload.gif
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function fs() {
var elem = document.getElementById("map_canvas");
elem.style.position="absolute";
elem.style.width="100%";
elem.style.height="100%";
elem.style.top="0px";
document.body.style.overflow = "hidden";
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:400px; height:300px"></div>
<a href="#" onclick ="fs()">makefullscreen</a>
</body>
</html>
最佳答案
最大化后您需要重新初始化 map ...代码如下:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function fs() {
var elem = document.getElementById("map_canvas");
elem.style.position="absolute";
elem.style.width="100%";
elem.style.height="100%";
elem.style.top="0px";
document.body.style.overflow = "hidden";
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:400px; height:300px"></div>
<a href="#" onclick ="fs(); initialize();">makefullscreen</a>
</body>
</html>
希望这有帮助， 大风
关于javascript - 使 div 内容(googlemap)全屏显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2884962/