画像のサイズが取得できません

Internet Explorer の右クリックメニュー拡張用スクリプトを作っています。

画像上で右クリックすると画像のサイズが表示されるようにしたいのですが、うまくいきません。

<script type = "text/javascript">
　var parentWindow = window.menuArguments;
　var eventSource = parentWindow.event.srcElement;
　var tagName = eventSource.tagName.toUpperCase();
　var URL;
　if (tagName == "IMG") {
　　URL = eventSource.src;
　　var newImg = new Image();
　　newImg.src = URL;
　　alert("画像のサイズは " + newImg.width + "×" + newImg.height);
　};
</script>

これにより、たとえばこのOKWaveのページの左上にあるロゴは

　　画像のサイズは 220 × 54

と表示されますが、

たとえば http://goo.gl/I9bEQf では

　　画像のサイズは 0 × 0

となってしまいます。

なぜでしょうか？

原因と解決法を教えていただけると嬉しいです。

No.2 回答者： Kaneyan-R 回答日時： 2014/04/28 21:07

これ、「goo.gl/I9bEQf」と実際の画像と、どちらでやってます？

IEで画像見ると、リンクを開いた時の画像のURLと、実際の画像のURLが違うんですが・・・


変数”URL”に、どっちのURLが読み込まれているか確認してみて下さい。
多分「goo.gl/I9bEQf」が入ってるんじゃないかなぁ・・・

CGIやらでContents-Typeを”image/jpeg”でデータ送ってきてるから、ブラウザはJpeg画像として認識してるんだろうけど、「I9bEQf」って、普通に見たら何か分からないファイルですよね？
だから、直接「I9bEQf」見に行って画像じゃないから 0x0 で出してる・・・・と思ってみたり。

この回答への補足

短縮URLはこのページの閲覧者の便宜のために使ったものですが、テストは元URLで行っていますし、他の様々なサイト・画像でも行っています。したがって当方が問題にしている現象は短縮URLとは無関係です。

補足日時：2014/05/01 00:52

No.1 回答者： yamada_g 回答日時： 2014/04/28 18:39

画像の読み込みが完了する前に、alertが実行されているのではないでしょうか。

newImgのonloadイベントで、alertを実行するようにしてみてはいかがでしょうか？

この回答への補足

ご回答ありがとうございます。

ご指摘のとおり onload を使ってみましたが、

<script type = "text/javascript">
　var parentWindow = window.menuArguments;
　var eventSource = parentWindow.event.srcElement;
　var tagName = eventSource.tagName.toUpperCase();
　var URL;
　if (tagName == "IMG") {
　　URL = eventSource.src;
　　var newImg = new Image();
　　newImg.src = URL;
　　newImg.onload = function() {
　　　　alert("画像のサイズは " + newImg.width + "×" + newImg.height);
　　}
　};
</script>

と書いたところ、どの画像でも正常に動作しない（alert が出ない）という結果になりました。

これを修正して

<script type = "text/javascript">
　var parentWindow = window.menuArguments;
　var eventSource = parentWindow.event.srcElement;
　var tagName = eventSource.tagName.toUpperCase();
　var URL;
　if (tagName == "IMG") {
　　URL = eventSource.src;
　　var newImg = new Image();
　　newImg.onload = function() {
　　　　alert("画像のサイズは " + newImg.width + "×" + newImg.height);
　　}
　　newImg.src = URL;
　};
</script>

と、newImg.src = の行を後に持ってくると、

onload を使わない当初のスクリプトでサイズが表示されていた画像では正しく動作しましたが、

onload を使わない当初のスクリプトでサイズが表示されなかった画像では alert が出ない

という結果になりました。

ということで未解決のままです。

onload とは別の要因があるのでしょうか？

なお、テスト環境の IE のバージョンは IE11 です。

補足日時：2014/05/01 00:13

この回答へのお礼

ありがとうございました。
感謝いたします。

お礼日時：2014/05/24 01:43