情報ウインド(バルーン)内の画像が下にはみ出る

63 views
Skip to first unread message

MCタイチ

unread,
Dec 11, 2006, 2:09:41 AM12/11/06
to Google-Maps-API-Japan
はじめまして。最近GoogleMapsを使って下記のようなサイトを始めました。
http://www.mc-taichi.com/map/index.php

問題はマーカをクリックして情報ウインドを開いたときに、中の画像がバルーンの枠から下にはみ出るというものです。
正確にはバルーンの高さが足りなくて、文章(<p>タグ)より下の部分はバルーン外に表示されるとでも言いましょうか。
尚この現象はページを開いて最初にそのマーカーをクリックしたときだけで、2回目以降は正しく表示されます。

以下はバルーン内のHTMLの例です。

********************************************************************************************
<div class="info">
<h2>明石海峡大橋</h2>
<span class="poster">
by <a href="../bbs/user_int.php?user=1" target="_blank">MCタイチ</a>
</span>
<a href="img/061208okusi.jpg" target="_blank">
<img src="img/sum/061208okusi.jpg" alt="明石海峡大橋" />
</a>
<p>長さも長いけど高さもある巨大な橋。バイクで走ると路肩から下が見えてちょっと怖い。</p>
<div class="bottom">
<a href="setmod.php?mod=96">修正</a>
</div>
</div>
********************************************************************************************
画像<img>はCSSで右にフロートさせています。

もし最初から正しく表示させる手立てがあればお聞きしたいと思い投稿しました。

kino

unread,
Dec 11, 2006, 10:01:39 AM12/11/06
to Google-Maps-API-Japan
img タグの中で widthと height を指定してみて下さい。

サイズ指定がないと画像を読み込むまで幅/高さが判らないので、
バルーンはデフォルトサイズで生成されてしまいます。
この場合、画像が大きいとはみ出す。という事だと思います。
2度目以降ではみ出さないのは、すでにサイズを取得済みだから。

MCタイチ

unread,
Dec 11, 2006, 11:21:51 AM12/11/06
to Google-Maps-API-Japan
すばらしい!仰る通りでした。
widthとheightを指定したら最初から正しいバルーンサイズになりますね。
言われてみれば納得なんですが、気付きませんでした。
ありがとうございました。

Reply all
Reply to author
Forward
0 new messages