.fadeOut(display:none)与地图之间的冲突

时间:2012-02-18 00:01:13

标签: jquery html css google-maps

(我改变了问题,因为我发现了这个冲突)

http://pedroversolato.com/EASB(我正在处理的页面)

我有一个用于背景的全屏幕地图,通过链接上的绑定点击来切换。当dom准备就绪时,我会在地图的div(#map_canvas)上调用.fadeOut函数,当你点击链接时,我会调用fadeIn。它工作,但当我打开地图时,它只显示左上角的一小块地图,但我发现display:none(由fadeOut()使用)与谷歌地图之间存在冲突

note1:打开链接上的地图,转到“contato”链接,然后点击地图打开全屏地图

有没有办法运球呢?

2 个答案:

答案 0 :(得分:1)

正如我在另一篇文章中所说,你需要在地图上触发调整大小。

首先,在您的script.js文件中,将初始化地图的所有代码从initialize函数移动到最后一个document.ready,就像您在#google_mapa上设置点击事件一样。然后添加回调到$(“#map_canvas”)。fadeIn并在该回调中调用google.maps.event.trigger(map,'resize')

你需要这样做的原因是fadeIn / fadeOut改变了地图容器的显示值,这有效地将它带入和移出DOM。

答案 1 :(得分:0)

我有同样的问题,触发调整大小的方法对我不起作用,然后我试试这个:

$('#map_canvas')。css({'opacity':0.0}); //隐藏

$('#map_canvas')。css({'opacity':1}); //显示**

它的工作正常,但并不漂亮;)

相关问题