2

非営利団体の取締役会を一覧表示するページを作成しています。ライトボックスには、ビジネスの場所を特定するGoogleマップなどの追加情報があります。見た目は素晴らしいですが、取締役会が複数（10人以上）いて、多くのGoogleマップではページの読み込みが非常に遅くなっています。読み込みがとても遅いので、ほとんどスクロールできません。（Firefox 20を使用しています）Chromeでテストすると、それほど遅くはありませんが、場合によっては遅くなることがあります。

ライトボックスが開くまで、Googleマップのみをロードする方法はありますか？

注：Googleマップの読み込みが停止するのを確認すると、ページは非常にスムーズに実行されます。グーグルマップがロードされている間、それは遅くてぎくしゃくしているだけです。

これが私のライトボックス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>

Fancybox2とjQuery1.8.3を使用しています。

ライトボックスがトリガーされるまでマップの読み込みを停止するにはどうすればよいですか？

4

1 に答える 1

1

<iframe>埋め込みコードを使用してこれを行う方法を見つけることができませんでした。私が行ったことは、Fancyboxが呼び出されたときにgmap3を使用してマップをロードすることです。これが私が使用したコードの例です：

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