使谷歌地图响应调整

Question

可能重复：
Resizing google map according to browser resizing

所以通常谷歌使用JS API是这样的地图......

现在，如果我要刷新页面，使用开发人员工具，并且t母鸡把开发工具放下来看起来就像这样。

所以我想知道我怎么才能得到它重绘的控制和调整地图的大小时，窗口大小。我在这里试过这段代码。但是，没有去...

#map_canvas {width:100%;height:100%;position: absolute; top: 42px; left: 0; right: 0; 
bottom:0; z-index: 1; overflow: hidden; } 

Answer 1

设置当window.onresize事件发生在#map_canvas样式属性：

window.onresize = function(event) { 
    var style = document.getElementById('map_canvas').style; 
    style.width = '100%'; 
    style.height = '100%'; 
    style.position = 'absolute'; 
    style.top = '42px'; 
    style.left = '0'; 
    style.right = '0'; 
    style.bottom = '0'; 
    style.z-index = '0'; 
    style.overflow = 'hidden'; 
    google.maps.event.trigger(map, 'resize'); 
    map.setZoom(map.getZoom()); 
} 

这个jQuery当量考虑到顶部

window.onresize = function(event) { 
    var el = $("#map_canvas"); 
    el.css("position", "absolute"); 
    el.css("top", "42px"); 
    el.css("left", "0px"); 
    el.css("right", "0px"); 
    el.css("bottom", "0px"); 
    el.css("width", "100%"); 
    el.css("height", $("body").height() - 42); 
    el.css("overflow", "hidden"); 
    google.maps.event.trigger(Maps.map, 'resize'); 
    Maps.map.setZoom(Maps.map.getZoom()); 
} 

的42PX