スポンサード リンク
ブログのデザインを変更したので、今度は草野球グランドマップのデザインを変更してみました。ブログと同じくグリーンの色調です。
新しいデザインはヘッダ部分の高さと左リスト部分の幅だけを固定して、あとはブラウザの表示領域にぴったりおさまるようにJavaScriptでスタイルを調整しています。これによって地図の表示領域もブラウザのリサイズにあわせて変更されるようになっています。本家のGoogle Mapsみたいでかっこいい！と自画自賛。
ここでGoogle Maps APIの注意点をひとつ。Google Maps APIでは地図を表示するコンテナ領域のデフォルト・サイズを元に、地図の中心点などを決めていますが、地図の大きさが変更されても中心点はデフォルトのまま。そのためブラウザのリサイズにあわせて地図の大きさを変更したりすると、setCenter()などのメソッドの動きが変になってしまいます。
そのため、Google Maps APIではGMap2クラスにcheckResize()というメソッドが用意されています。リサイズにあわせて地図の大きさを変更するときは、同時にこのメソッドを記述するといいようです。
スポンサード リンク
Written by F.Ko-Ji
- あらたにすの文字サイズを変更したらIEが落ちるのですが
- 独自ドメインやサブドメインで運営されるブログがSEOに有利な理由
- F906iのイケてないところを3つ
- Firefox3のURLサジェストに表示されるURLをカスタマイズする方法
- AdSense のクリックスルー率を保つ基本はフィルタの利用
お探しの情報が見つからない場合はサイト内検索もお試しください。
トラックバック
このエントリーのトラックバックURL:
前のエントリー: « IE7の正式名称でモテモテ
次のエントリー: チートシートとは(cheat-sheetとは) »
コピペにご利用ください。
タイトル:URL:
リンク用HTMLタグ:
(共同運営)
(共同運営)
コメント
おおおお、これはいいですね。
ウインドウの中にテキストボックス・・・なるほど・・。
それと、checkResizeとは良い事聞きました！諦めて放置してたのですが、これで綺麗に実装できそうです。
スクロールバーは・・正直最初戸惑いました・・・。
投稿者: ten | 2006年08月08日 19:55
>>tenさん
ありがとうございます。checkResizeがお役に立ててなによりです。
左のスクロールバーってやっぱり最初は違和感ありますよね。しばらく右側にしてみようかな。
投稿者: F.Ko-Ji | 2006年08月08日 21:38