HTML圖像地圖和預加載圖像

我已經構建了一個很大的舊學校HTML圖像地圖。當您將鼠標懸停在區域標記上時，會加載另一個圖像來替換整個地圖。總共有30個鼠標懸停的圖像，爲了避免加載延遲，我使用jQuery預加載了它們。HTML圖像地圖和預加載圖像

Firebug Net面板顯示所有圖像正在加載在頁面加載好（沒有鼠標懸停觸發）。現在，當我將鼠標懸停在某個區域時，螢火蟲顯示此圖像正在被請求第二次。儘管事實上我清楚地看到文件名在Firebug中高了幾行。

這是正常的行爲嗎？似乎預加載工作...但鼠標懸停仍然發送請求到服務器，以獲得圖像導致圖像交換前1-2秒的延遲。

這是所有直的HTML，沒有涉及的AJAX。

THX

來源

2009-09-22 stef

你可能需要調整您的Web服務器上的高速緩存配置，使瀏覽器知道不重新下載圖像。

來源

2009-09-22 20:53:04 lod3n

當Firebug未打開時，您是否看到1-2秒的延遲？我有類似的問題，並永遠不能真的告訴如果它實際上是再次請求圖像。拖曳我的日誌時，我也不會看到新的請求。另外，當我通過Safari瀏覽器查看時，我從未看到過這種行爲，所以我將它寫入Firebug。

來源

2009-09-22 20:57:07 theIV

可以將一個圖像鏈接到特定部分上的特定圖像中的多個頁面。

這被稱爲Html中圖像的映射。

您只需指定圖像的哪些區域應該鏈接到哪裏。

在下面的例子中，如果您將鼠標放在左上角，它將鏈接到xyz.com ....並在右下角....它鏈接到abc.com。

<img src="test.jpg" usemap = #example border=0> 
<map name=example> 
<area shape=Rect Coords=0,0,29,29 Href="http://www.example.com"> 
<area shape=Rect Coords=30,30,59,59 Href="http://www.example.com"> 
</map>

在上面的例子中，我們只使用矩形圖像映射。我們可以使用一些不同的形狀，如圓形或三可能的形狀是：

來源

2015-02-05 13:33:09

HTML圖像地圖和預加載圖像

回答

相關問題