css懸停對自定義形狀圖像的影響

我有一個coutry的地圖..我的任務是懸停在每個區他們將發光的影響..我不知道我如何完美做它..我可以使用html地圖標記像：css懸停對自定義形狀圖像的影響

<img src="district1.png" width="xxx" height="yyy" alt="d1" usemap="#d1_map"> 
<map name="d1_map"> 
     <area shape="poly" coords="0,0, 35,36, 82,126 .... " styles="...."> 
</map>

但這不是完美的，因爲你知道地圖不具有多邊形形狀..所以任何其他的想法？在此先感謝..

來源

2014-01-19 Wahid Masud

http://stackoverflow.com/questions/13845958/how-to-get-the-path-coordinates-of-a-shape-for-use-with-image-maps –

http://stackoverflow.com/questions/15649184/image-hover-when-over-area-map - 圖像懸停在區域地圖上時 – MortenMoulder

使用地圖標記內的區域標記劃分地圖的每個區域;
爲您的地圖指定一個id或class（例如<map class="mymap">）;
使用CSS時，它的徘徊建立在你的區域的box-shadow：

.mymap area:hover{ box-shadow:0 0 15px #ffffff }

這應該使當鼠標懸停他們的領域煥發。基本上，您將一個類分配給地圖，以便通過CSS輕鬆定位其子項。這樣，您不必爲每個區域分配一個班級。之後，您將其子項作爲目標，並使用：懸停事件將鼠標懸停時將該代碼應用到該區域。我真的好奇，如果它的工作，但它應該。

來源

2014-01-19 16:42:58

css懸停對自定義形狀圖像的影響

回答

相關問題