リスト内の名前の上にマウスを置く<img>と、マップのsrc属性が、そのゾーンが強調表示されたマップイメージに変更されるマップを作成しています.attr()。このように変更するには、jqueryのメソッドのみを使用します。
$("img.map").attr("src","newmap.png");
それはすべてのブラウザでうまく機能しますが、Firefoxでは、画像が変更されると、最初に古い画像が消え、次に何も表示されない時間があり、次に新しい画像が表示されます。ChromeやIEのようにFirefoxでこの変更をスムーズに行うにはどうすればよいですか？ ??
（時間は本当に短いですが、ディレクトリ内でマウスを動かすと、マウスが動いている間ずっと画像が消えます）。
または、その効果を達成するためのより良い方法を知っているかもしれません。ありがとう
画像をプリロードしてみてください。ブラウザによって新しい画像が読み込まれると、点滅が発生します。
これは、src属性が明らかに変更されたために発生します。さて、新しい画像はまだダウンロードされていません。srcそのため、サーバーにリクエストを送信し、属性がすでに変更されている間はすべてレスポンスを待つ必要があります。これが、少しの間そこに何も表示されない理由です。これを回避する方法があります。JavaScriptで、新しい画像をソースとして新しい画像要素を作成します。本当に表示したいsrc画像の属性を変更するonloadイベントハンドラーを追加します。はい、これはプリロードが少し難しいかもしれませんが、最初のページのロード時間が短縮され、HTMLが乱雑になることはありません。
頭のてっぺんから、ホバーインテントと背景画像の組み合わせがこれに役立ちます。
不必要に画像をダウンロードしたくないので、ホバーインテントは適切です。
含まれているdiv（または画像自体）に元の画像または最後に表示された画像の背景画像を指定すると、ちらつきの影響が少なくなります。これらの画像変更の読み込み時間は異なる可能性があるため、これを何らかの読み込みアイコンを表示する機会として使用することもできます。
そうは言っても、元の画像を用意してから、領域にカーソルを合わせるたびに新しい画像を追加する方が理にかなっていると思います。そうすれば、画像要素がまだ存在しない場合にのみ追加でき（httpリクエストを保存）、さらに適切な変更を行うことができます（たとえば、元の要素をフェードオーバーします）。
お役に立てば幸いです。
問題は、最初に画像を参照したときに、ブラウザが画像をダウンロードしていることです。
src単一の要素の属性を変更する代わりに、2つの画像要素を使用してそれらを非表示/表示するだけです。