google-maps - Google マップの InfoWindow が Google Chrome でスクロールバーを表示する

Question

何らかの理由で、InfoWindow がコンテンツと共にスクロールバーを表示しています。InfoWindow の幅と高さをカスタマイズしようとしましたが、表示されません。ここから解決策を試しました Googleマップの情報ウィンドウが正しく表示されない

助けてくれてありがとう。

score 73 · Accepted Answer

ここで回避策を見つけました。

このJSfiddleを作成し、バグと回避策を表示しました。

外部リンクにアクセスしたくない場合は、回避策の説明を次に示します。

情報ウィンドウのコンテンツにラッピング div を追加します。

var infoWindow = new google.maps.InfoWindow({
    content: '<div class="scrollFix">'+infoWindowContent+'</div>',
    [...]
}).open(map);

CSS 定義を使用して、スクロールバーを回避します。

.scrollFix {
    line-height: 1.35;
    overflow: hidden;
    white-space: nowrap;
}

score 5 · Accepted Answer

スクロールバーを非表示にするには、コンテンツに高い z-index スタック順序を指定します。例:

var infowindow = new google.maps.InfoWindow({
    content: '<div style="z-index:99999">Message appears here</div>',
});

または、次のスタイルを追加します。

.gm-style-iw {
    overflow:hidden!important;
    height:55px!important; //for 3 lines of text in the InfoWindow
}

google-maps - Google マップの InfoWindow が Google Chrome でスクロール バーを表示する