こんにちわ。
【問題】
タイトルにもあるのですが、
IE8でinput type="image"にonmouseoverとonmouseoutをすると画像が消えてしまう現象で躓いております。
【目的】
IE8でinput type="image"にonmouseoverとonmouseoutをしても画像が消えないようにしたい。
【試したこと,情報】
・この問題は他のブラウザのChromeや、IEの別バージョンのIE7、IE9~11では起きず、IE8でのみ起こっています。
・input type="image"のsrc=""にはdata URLスキームを使用しています。(参考URL)。
また、src=""の画像はonmouseoverとonmouseoutのイベントが発生するまでは、画像が表示されています。
・input type="image"を<IMG>に変更したらonmouseoverとonmouseoutをしても消えなかったので、onmouseoverとonmouseoutに問題はなさそう。
また。IE8ですとdata URLスキームに32KBという制限がありますが今回の画像は32KB以下でした。(現に<IMG>に変更したら画像は表示されました。)
--HTML-- <input type="image" name="test" alt="" src="data:image/png;base64,スキーム部分(長いので省略します。)" onmouseover="testImg(this,data:image/png;base64,スキーム部分(長いので省略します。))" onmouseout="testImg(this,data:image/png;base64,スキーム部分(長いので省略します。))">
--JS-- function testImg(Obj, Path) { var tag = Obj.tagName; switch(tag.toLowerCase()) { case "img" : Obj.src = Path; break; case "input" : var type = Obj.getAttribute("type"); if(type.toLowerCase()=="image") { Obj.src = Path; } break; } }
詳しい方おりましたら教えていただけると幸いです
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/12/22 07:13
2017/12/22 07:41
2017/12/22 07:47
2017/12/22 07:52
2017/12/22 08:05