使用jQuery手风琴隐藏大部分googleMap [英] using jquery accordion hides most of googleMap

问题描述

我有一个带有2个选项卡的手风琴小部件。他们每个人都有一个GoogleMap。第一张地图得到正确显示，但当我打开第二张地图时，只有一部分地图出现在视口中。

如果我通过注释掉以下内容来移除小部件
$ b

  $（＃accordion）。accordion（{
 header：code，both maps are properly displayed。
 h3，fillSpace：true，event：mouseover
}）; 
  

如何在使用这个小工具的同时仍能正确显示地图？

请检查 http://forums.asp.net/t/1780781.aspx/1?using+jquery+accordion+hides+most+of+googleMap 来获取代码，因为发布内容相当繁重它在这个网站上。

非常感谢！ 需要观察手风琴的变化事件，并在地图触发时触发地图的尺寸​​变化事件。

示例： http://jsfiddle.net/doktormolle/VqzPE/

示例商店手风琴内容数据中的地图，因此您可以在发生更改时轻松访问它。

I have an accordion widget with 2 tabs. Each of them has a GoogleMap. The first map get properly displayed but when I open the second one, only a portion of the map appears in the viewport.

If I remove the widget by commenting out the following code, both maps are properly displayed.

$("#accordion").accordion({ 
        header: "h3", fillSpace: true, event: "mouseover" 
    });

How can I use this widget while still having both map displayed properly?

Check on http://forums.asp.net/t/1780781.aspx/1?using+jquery+accordion+hides+most+of+googleMap to get the code as it is quite a job to publish it on this site.

thanks a lot!

解决方案

You'll need to observe the change-event of the accordion and trigger the resize-event for the map when it fires.

Example: http://jsfiddle.net/doktormolle/VqzPE/

The example stores the map inside the data of the accordion-content, so you may easy access it when change fires.

这篇关于使用jQuery手风琴隐藏大部分googleMap的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！