質問: function() { this.setAttribute("src", this.getAttribute("src").replace("_on.", "_off.")); } } } } } if(window.addEventListener) { window.addEventListener("load", smartRollover, false); } else if(window.attachEvent) { window.attachEvent("onload", smartRollover); } ---------------------------------------------------- 画像に「●●_off」という名前つけると、マウスオーバー時に「●●_on」の画像へ切り替わるというものです。(●●は同じ名前です) 特定の画像が表示されないという具体的な内容ですが メニューとして4つの画像を縦並びでリスト表示させているのですが、その一番上の画像だけが表示されません。 表示されないのは、通常時に表示されるべき「●●_off.gif」です。 4つの画像は全てgif画像です。 IE6、7、8とFirefox3で試しました。 IE6、7、8は「●●_off.gif」が×印で表示され、そこにマウスオーバーすると「●●_on.gif」の画像が表示されます。マウスを離すとまた×印に戻ります。Firefoxは何も表示されず、マウスオーバーする場所もありません。 2~4つ目の画像については問題なく表示、切り替えも動作します。 パスが間違っているのではないかと思い確認し、念のため絶対パスをブラウザのアドレスに直接入力してみましたが、表示されません(404エラー)。 確実にサーバーへアップロードしているのに表示されません。 こんなことってあり得るのでしょうか?? ●●_on.gifの方は同様に確認すると表示されました。 さらに、jsのせいかもしれないと思い、jsの影響がない別のディレクトリにアップロードしてみました。上記と同様にブラウザに絶対パスを入力して確認しましたが、それでも表示されません。 まるでこの画像だけがネットに拒否されているかの様です・・・。 さらに、ファイル名が悪いのかと思い(あり得ないですが・・)、別の名前でいろいろと試しましたがやはり_offの方は表示されませんでした。 さらに、しつこいですが、4つのリストメニューのうち、一番最初だけが表示されないというバグではないかと思い、とりあえず表示されない「●●_off.gif」のリストだけをhtmlから消去してみました。 すると2~4番目にあったものがそのまま表示されます。一番最初だけが・・・というわけではない様です。 最後にダメもとで、gifをjpgに変えてアップロードしてみたら、表示されました・・・。 いちおう表示できたということで解決したのですが、何が原因だったのか、今後同じことが起こり、どうしてもgifでなければならない際を考えて、また、実はすごく根本的な間違いだったのでは?と思い質問させていただきました。 jsはまだ初心者のため、想像でいろいろと試しましたが解決しませんでした。勉強が足りないのは承知していますが、もし原因がお分かりの方がいらっしゃいましたら、ご教示ください。 宜しくお願いします。
回答: 画像ファイルの拡張子が .gif ではなく .GIF になっていたとか。 サーバーによるのかどうかわかりませんが、 大文字小文字の違いで画像が表示されないと言う事がありましたので。 だとすると、 .jpg に変えて表示されたと言うのが、 変換時に確実に小文字にされたのでしょうし、 HTML内の設定も小文字で入力されたのではないかと思います。