半透明の div とアンカーでオーバーレイする必要があるイメージ マップを含むイメージがあります。画像と画像マップはページごとに異なるため、実際のコードは画像マップを動的に生成し、オーバーレイされたリンクに 1 つの div とアンカーを再利用します。
Fiddleでコードの簡略化されたバージョンを確認できます。Firefox と IE の両方で動作させるのに苦労しました。コードは現在のように両方で機能しますが、マウスを IE の黄色のボックスの左側にゆっくりと移動すると、「ハイライト」div の白い背景が取り残されます。アラートのコメントを外すとわかるように、mouseleave機能は毎回トリガーされるため、問題は次の行にあるようです。
$('#highlight').css('display', 'none');
CSS をハイライト div のアンカーからハイライト div 自体に変更すると、Firefox と IE の両方で長引く div の問題が発生します。ハイライト a:hover を使用すると、IE でのみ発生し、Firefox は正常に動作します。
ハイライト ボックスのインライン CSS から「background-color: white」を除外すると、IE でコードが失敗します。ハイライトはまったく表示されません。
a:hover 疑似クラスとハイライト div 自体の間で CSS を切り替えたり、JQuery でさまざまな関数を使用したり、IE で確実に機能するものはありません。
MapHilight などの JQuery プラグインを調べてみたところ、使用しなければならない他のコードで問題が発生していました。
これをIEや他のブラウザで確実に動作させるために私が欠けているものを見ることができますか?