GoogleMapをページ全体で表示する方法
この記事は公開日より年以上経過しています
情報が古くなっている可能性がありますのでご注意ください。
CSSは横幅(width) は 100% の指定が可能なのですが、縦(height)がうまく効きません。 そこでリアルタイムに縦のピクセル数を指定する事で100%っぽく動くような事が可能になります。
ウィンドウをリサイズ時にJavaScriptを動かす方法が、なかなか分からず探すのに苦労したのでメモをココに残しておきます。
<SCRIPT TYPE="text/javascript">
<!--
function mapSizeChange(){
document.getElementById('map').style.height = self.innerHeight+'px';
}
window.onresize = mapSizeChange;
//-->
</SCRIPT>あと、Google Maps の JavaScript の最初に mapSizeChange(); を書いておかないと、最初だけ初期の指定サイズになってしまいます。
追記
Windows IE ではダメでした。 (^_^; もう少し、ブラウザ毎の記述をしないとダメなようです。 また、成功したらお知らせします。
更新
