iframeを使わず、Google Maps APIで地図を埋め込むブログパーツを作っています。
元Netscapeユーザな私のプライベートなPCも開発環境のPCの既定のブラウザは当然、Firefox 3。Internet Explorerは、Microsoft Updateのためだけに使用しています。
ただ、一般的なユーザはIEを使用されているのでコンテンツはIEでもきちんと表示されなければいけません。コンテンツ作成を主業務とされる技術者なら、IEとFirefoxとの差異に対するノウハウをお持ちでしょうが、初めて携わる私にはそのようなノウハウはないので、結構、苦労しています。今まで、それが嫌でコンテンツ作成作業から逃げていたのですけど…
で、Google Maps APIを使った地図埋め込みパーツですが、Firefox 3ではすんなり作成できました。パーツを埋め込んだページをFirefox 3で表示しても、当然問題なし。ところが、これをIEで表示すると、ページが真っ白…
エラーメッセージとしては、「GMap2が宣言されていません」（うろ覚えなのですが、確か、こんな感じ）。職場でコンテンツ屋さんはいないので、とにかくググって調べたところ、ありました。野菜小屋の地図をGoogle Maps APIで作ってみるテストに
要はIEはせっかちで、DOMを構築する前にページに埋め込まれたスクリプトを実行してしまうらしいのです。
ブログパーツはページの一部を生成するスクリプトを埋め込むscriptタグですので、body/@onloadにJavaScriptの関数を指定できません。そこで、野菜小屋の地図をGoogle Maps APIで作ってみるテストと同じ方法で回避することにしました。
慣れないせいもあって思うように作業を進められず、結構、イライラしています。職場の自動販売機からペプシNEXが消えるし…これは関係ないか。
元Netscapeユーザな私のプライベートなPCも開発環境のPCの既定のブラウザは当然、Firefox 3。Internet Explorerは、Microsoft Updateのためだけに使用しています。
ただ、一般的なユーザはIEを使用されているのでコンテンツはIEでもきちんと表示されなければいけません。コンテンツ作成を主業務とされる技術者なら、IEとFirefoxとの差異に対するノウハウをお持ちでしょうが、初めて携わる私にはそのようなノウハウはないので、結構、苦労しています。今まで、それが嫌でコンテンツ作成作業から逃げていたのですけど…
で、Google Maps APIを使った地図埋め込みパーツですが、Firefox 3ではすんなり作成できました。パーツを埋め込んだページをFirefox 3で表示しても、当然問題なし。ところが、これをIEで表示すると、ページが真っ白…
エラーメッセージとしては、「GMap2が宣言されていません」（うろ覚えなのですが、確か、こんな感じ）。職場でコンテンツ屋さんはいないので、とにかくググって調べたところ、ありました。野菜小屋の地図をGoogle Maps APIで作ってみるテストに
これもよく知られたことらしいのだけど、Google Maps APIのオブジェクトを初期化する時点では、ウェブブラウザがドキュメントオブジェクトモデルの構築を完了していなければならず、しかしIEでは、このタイミングが独特らしい。
要はIEはせっかちで、DOMを構築する前にページに埋め込まれたスクリプトを実行してしまうらしいのです。
ブログパーツはページの一部を生成するスクリプトを埋め込むscriptタグですので、body/@onloadにJavaScriptの関数を指定できません。そこで、野菜小屋の地図をGoogle Maps APIで作ってみるテストと同じ方法で回避することにしました。
というわけでここでは、addEventListener/attachEventで回避することにしましたよ。
慣れないせいもあって思うように作業を進められず、結構、イライラしています。職場の自動販売機からペプシNEXが消えるし…これは関係ないか。
