1

ファンシーボックス ( http://fancyapps.com/fancybox/ ) を使用して、Google マップにいくつかの場所を表示します。例の 1 つを次に示します。

<script type="text/javascript"> 
    $(document).ready(function() {
    $('.fancybox-media').fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        helpers : {
            media : {}
        }
    });
    });        
</script>

とhtml

Google maps
<ul>
        <li><a class="fancybox-media" href="http://maps.google.com/maps?q=Eiffel+Tower,+Avenue+Gustave+Eiffel,+Paris,+France&t=h&z=17">Search results</a></li>
        <li><a class="fancybox-media" href="http://maps.google.com/?ll=48.85796,2.295231&spn=0.003833,0.010568&t=h&z=17">Direct link</a></li>
        <li><a class="fancybox-media" href="http://maps.google.com/?ll=48.859463,2.292626&spn=0.000965,0.002642&t=m&z=19&layer=c&cbll=48.859524,2.292532&panoid=YJ0lq28OOy3VT2IqIuVY0g&cbp=12,151.58,,0,-15.56">Street view</a></li>
</ul>

しかし、マウスホイールでズームイン/ズームアウトすることはできますか?

4

1 に答える 1

1

Google マップをiframe(Web サイトに埋め込む推奨される方法) に埋め込むと、マウス ホイールを使用してマップを拡大/縮小することはできません (ただし、ストリート ビューの画像を拡大することはできます) ... それは通常のことです。行動。

純粋な html の例として、このJSFIDDLEiframeを確認してください。

ファンシーボックスでGoogleマップを表示すると、実際には で囲まれているiframeため、マウスホイールを使用してズームインまたはズームアウトすることもできません....そのため、質問に関しては可能ではないと思います。

これはファンシーボックスの問題ではなく、html のiframe制限です。

編集：

Google マップのフュージョン テーブルは、マウス ホイールを使用してズームイン/ズームアウトできます。この場合、これらのマップはiframe次のようなファンシーボックス モードを使用して開く必要があります。

$(".fancybox").fancybox({
    type: "iframe"
});

JSFIDDLEを参照してください

私の結論：それはすべてコンテンツのフォーマットに依存します。Fancybox は 内のコンテンツに制限を設定しませんiframe: 通常の htmliframeでできることは何でも、fancybox (iframeモード) 内でできることです。

于 2013-03-04T21:47:18.790 に答える