【JavaScript】IE6だと画像が表示されたり、されなかったり

またもやIE6でちょっと嵌ったのでメモ。

IE6 SP2(Windows XP SP2のIE)だとgif画像がなぜか表示されない。タグは生成されているけど、右クリック→画像の表示とやると見える。しかもブラウザによって見えたり見えなかったりするので、読み込みとかキャッシュが関連するのではないかと調べてみた。

ちなみに現象が起きたのはWordpressのcustom-smilies-seを使って顔文字(絵文字)をポップアップで表示するとき。

参考になったのはここのサイト。

要はJavascriptでimgタグのsrcにセットしていると、画像が読み込まれる前に処理が終わってしまった場合、画像が画面に表示されない。

一度ブラウザにキャッシュされている画像は表示される。

なので、画面を表示するときにimageオブジェクトを使って先行読み込みをしてあげれば良い。

簡単なJavaScriptのコードは以下

objImage = new Image();
objImage.src="test.gif";

genlist_post.js.phpに追加したコードは以下

preLoadImage();
function preLoadImage() {
  <?php
    $i = 1;
    foreach ($clcs_smilies as $k => $v) {
        echo 'objImage_' . $i . ' = new Image();';
        echo 'objImage_' . $i . '.src = "' . $imagesdirurl . $v . '";';
        $i++;
    }
    ?>
}

さらに画面が表示するまで時間がかかるようになったので、ベタで表示する方法に変更するかも。

コメント

  1. コンニチハ。

    IE7で同じような症状に悩まされていましたが、
    お蔭様で解決する事が出来ました。

    貴重な情報有難うございます!!

    返信削除
  2. お役に立ったようで何よりです。
    IE7でも似たようなことがおきるんんですね。

    返信削除

コメントを投稿

このブログの人気の投稿

【.NET】DataGridViewを選択した際に背景色を変更しない

Can't open PID file /var/run/nginx.pid (yet?) after start: Too many levels of symbolic links

【PostgreSQL】ROWNUMのように行番号(現在行)を取得するROW_NUMBER