HTML背景圖片地圖

Question

是否可以從背景圖片創建圖片地圖？我希望屏幕的兩側可點擊，並且我沒有看到任何方式在沒有地圖的情況下完成此操作。

Answer 1

您可以用下面的CSS創建一個絕對定位的圖像，以便它縮放以適應頁面。

img.bg{ 
    position:absolute; 
    z-index:-100; 
    top:0;left:0;bottom:0;right:0; 
} 

然後使用這個庫來確保圖像映射與頁面縮放。

https://github.com/davidjbradshaw/image-map-resizer

Answer 2

您可能需要使用透明固定浮動<a>錨標籤這樣的：

<a style="display: scroll; position: fixed; top: 25px; left: 0px; width: 20px; height: 20px;" href="#"></a> 

<a style="display: scroll; position: fixed; top: 25px; right: 0px; width: 20px; height: 20px;" href="#"></a> 

您可能需要使用bottom屬性，而不是top到標籤相對於窗口的底部位置。