壁板内的谷歌地图 – 灰色正方形

谢谢你花时间检查我的问题。

这是 – 我看到了我试图在客户端网站上复制的Google Maps实现，但我遇到了困难。

这是我试图重新创建的效果 – http://www.franckmaurin.com/ 。 当您点击“联系”时，Google地图会从页面顶部展开，推送内容。

所以这就是我尝试的方式 –

 
 
 
 
Open The Map .. rest of content  

然后我的CSS

 #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; display：none}但这个问题总是在那里。如果我不隐藏地图容器，那么地图就没有问题。

有没有人有任何想法，我在这里做错了什么？

Answer 1

你应该设置#map-container css style，

 #map-container { float:left; height:350px; width:960px;//or other width you need display:none; } 

然后使用jquery来控制#map-container slideUp和slideDown