2

我正在为一个列出其董事会的非营利组织创建一个页面。在灯箱中,我有其他信息,包括精确定位其营业地点的谷歌地图。它看起来很棒,但是他们有几个董事会(10+)并且许多谷歌地图导致页面加载非常缓慢。我几乎无法滚动它加载如此缓慢。(我使用的是 Firefox 20)当我在 Chrome 中进行测试时,它并没有那么慢,但有时会很慢。

有没有办法在打开灯箱之前只加载谷歌地图?

注意:一旦我看到谷歌地图停止加载页面运行非常流畅。加载谷歌地图时它只是缓慢而生涩。

这是我的灯箱 HTML:

<div class="hide">
 <div id="name">
  <div class="grid_8">
   <p class="bio">Info Goes Here</p>
   <p>Info Goes Here</p>
  </div>
  <div class="grid_4">
   <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="map-code"></iframe><br /><small><a target="_blank" href="map-link" style="color:#0000FF;text-align:left">View Larger Map</a></small>
  </div>
  </div>
</div>

我正在使用 Fancybox 2 和 jQuery 1.8.3。

如何在触发灯箱之前停止加载地图?

4

1 回答 1

1

我无法找到使用<iframe>嵌入代码的方法。我所做的是在调用 Fancybox 时使用gmap3加载地图。这是我使用的代码示例:

$(function() {
  $(".fancybox").fancybox({
         beforeLoad : function() {  
            $("#map").gmap3({
                 // MAP OPTIONS
            });
         }
   });  
});
于 2013-03-15T03:37:36.587 回答