感谢您花时间检查我的问题。
是这样的——我看到了一个谷歌地图的实现，我正试图在一个客户端网站上复制它，但我遇到了困难。
这是我试图重建的效果- http://www.franckmaurin.com/。当你点击"获取联系"时，谷歌地图会从页面顶部展开，将内容向下推。
我是这样尝试的——
<body>
<div id="map-container">
<div id="map_canvas"></div>
</div>
<p id="open-map">Open The Map</a>
.. rest of content
</body>
#map_canvas {
height:350px;
width:100%;
}
#map-container {
height:0px;
}
. .然后JS
$('.open-map').click(function() {
$('#map-container').css("height",350);
});
. .这显然是一个简化版。我还想给下拉菜单添加动画。但我总是得到一个不完整的地图，看起来像这样http://d.pr/rNnr。不完整，有很多灰色。我尝试了不同的方法来打开和关闭(包括设置{height:350px;在容器上显示:none}，但这个问题总是存在。如果我不隐藏映射容器，那么映射就没有问题。
有没有人知道我在这里可能做错了什么?
你应该设置#map-container的css样式，
#map-container {
float:left;
height:350px;
width:960px;//or other width you need
display:none;
}
然后使用jquery控制#map-container、slideUp和slideDown