1 
    <a class="showmap" href="#">Show map</a>
<div id="map" style="height: 400px; width: 400px;"> </div>
<script type="text/javascript">
$(function() { 
 //initialise map
});

$(document).ready(function(){
    $('.showmap').click(function(){
    $("#map").slideToggle();
    google.maps.event.trigger(map, 'resize');
   });
});
</script>

我相信你现在可以说出来。我正在尝试打开和关闭谷歌地图。问题是单击 showMap 按钮后的地图在此站点上显示如下：

http://forum.jquery.com/viewImage.do?fileId=14737000003424984&forumGroupId=14737000000003003

有人可以指出我在做什么错吗？我希望地图显示在整个 div 上。如果您查看该图片的底部，您会注意到地图文案和品牌资料在正确的位置，但地图没有。它不会将事件移动到 div 的底部。它只是跳回到图片中的位置。

4

1 回答 1

1

看起来好像您调用调整大小为时过早。尝试这样做：

$("#map").slideToggle('slow', function() {
    google.maps.event.trigger(map, 'resize');
});

这将在滑动切换完成后调用调整大小函数。

如果上述方法不起作用，解决方法是将地图 div 包含在另一个隐藏溢出的 div 中，然后滑动切换父 div 而不是地图 div

于 2013-05-13T13:29:23.450 回答