1

このページでFancyBox2を使用しています：http ：//encoreazalea.com/ee/botanical-gardensポップアップウィンドウにGoogleマップを表示します。

ウィンドウは正常に表示されますが、すべてのマップにスクロールバーがあります。表示ウィンドウのサイズを変更しようとしましたが、送信した指示に正しく応答しないようです。

HTMLは次のとおりです。

<h3 class="state">Washington D.C.</h3>

<div class="gardens">

<p class="garden">US National Arboretum<br />
<a href="http://www.usna.usda.gov/">Website</a> | <a class="map" href="#directions5148">Directions</a></p>
</div>

<div class="gardens">
<div id="directions5148" style="display:none">
<iframe width="600" height="440" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?ie=UTF8&amp;q=US+National+Arboretum&amp;fb=1&amp;gl=us&amp;hq=US+National+Arboretum&amp;hnear=US+National+Arboretum&amp;cid=0,0,12451978746893569755&amp;t=h&amp;ll=38.912424,-76.96852&amp;spn=0.008014,0.013733&amp;z=16&amp;iwloc=A&amp;output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?ie=UTF8&amp;q=US+National+Arboretum&amp;fb=1&amp;gl=us&amp;hq=US+National+Arboretum&amp;hnear=US+National+Arboretum&amp;cid=0,0,12451978746893569755&amp;t=h&amp;ll=38.912424,-76.96852&amp;spn=0.008014,0.013733&amp;z=16&amp;iwloc=A&amp;source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>

</div>

</p>
</div>

jQueryは次のとおりです。

<script type="text/javascript">
    $(".map").fancybox({
            wrapCSS    : 'fancybox-custom',
            width : 700,
            height : 600,
            closeClick : true,
            helpers : {
                title : {
                    type : 'inside'
                },
                overlay : {
                    css : {
                        'background-color' : '#eee'
                    }
                }
            }
        });
</script>

ウィンドウの幅と高さを何に設定しても、常に同じサイズで表示され、マップの周りにスクロールバーがあります。

私の目標は、スクロールバーを取り除くことです。

ありがとう。

4

3 に答える 3

1

代わりに、divに直接ディメンションを追加してみます。

<div id="directions5148" class="map_window" style="display:none">

CSS：

.map_window{
   width: 700px;
   height: 600px;
   overflow: hidden;
}
于 2012-09-06T18:11:54.950 に答える
1

必要なサイズを取得するには、オプションautoSize : falseANDAND を設定する必要がある場合もあります。fitToView : falsescrolling: "no"

于 2012-09-06T22:58:19.823 に答える
-1

それはばかげていましたが、私がこれを含めなかったため、fancyboxは適切に応答していませんでした：

$(document).ready(function() {...

追加した後、残りのコードの応答性が向上しました。

于 2012-09-08T11:38:49.397 に答える