input type=”image”とか。初めて見ました。
いや使いたくて使ったわけじゃないです。仕事で改修することになったページで仕方なく。じゃなけりゃこんな気持ち悪い要素使いません。

inputに画像を指定するときに使うらしいんですが、こんなもの使わなくたってinput type=”submit”かaタグ使って、バックグラウンドで画像指定すればそれでいいじゃん。
まあシステム屋さんが作ったみたいなので仕方ないですが。

ちなみにinput type=”image”の使い方はこちら。
http://www.tagindex.com/html_tag/form/input_image.html

サンプルソースをコピペするとこんな感じ。
<input type=”image” src=”button.gif” alt=”送信する”>

srcで指定した画像が表示されるそうです。

さて、ここからが問題ですが、今回改修したシステムではtype=”image”で画像が設定されていました。この画像を変えたかったわけです。
なのでsrcを新しい画像のパスに変えました。

これで大丈夫・・・・と思ったら何かがおかしい。
画面をリロードしてみると、確かに最初は新たに指定した画像が出てくるんですが、画像上にポインタを持ってくると、なんと古い画像に変わる！
いや有り得ないでしょｗｗｗｗ

一瞬キャッシュかと思ったんですが、どうもそうではないらしい。キャッシュ削除しても起こるし。

いろいろ試してみたんですが、原因が分かりました。

まず元々はこんなコードだったんです。
<input type=”image” name=”button” src=”button.gif”>

これをこう変えた。この時点ではマウスオーバー時に画像が古いものになる。
<input type=”image” name=”button” src=”button2.gif”>

そして正常に表示されるようになったのがこれ。
<input type=”image” name=”button2″ src=”button2.gif”>

・・・つまり、srcで指定した画像名（から拡張子を抜いたもの）と、nameの文字列が一致していないと不具合が起こる可能性があると。

いや、理屈は分かんないですよ？リファレンスにもそんなこと書いてないし。nameとか無関係そうだし。
でも上の現象を見てみると、そうとしか思えない。

まあよっぽどのことがない限りこんな要素使わないのでこれ以上深入りするつもりもないですが、もし理屈を簡単に説明できる人がいたら、コメントとかで教えてくれると嬉しいかも。簡潔に。