ImageMapster - 顯示影像地圖上的文字鏈接懸停

Question

區我有懸停效果使用ImageMapster.js圖像映射......旁邊的圖像是文本鏈接的列表至極參考圖像映射區域的特定區域。懸停在文本鏈接上時是否可以突出顯示圖像地圖區域？

例如爲：

<img src="map.png" usemap="#ch" style="width:100%;"> 
<map id="usa_image_map" name="usa> 
<area href="http://ab.com" state="ab" shape="poly" coords="259,256,275,257,..."><area href="http://xy.com" state="xy" shape="poly" coords="332,421,329,416,..."> 
</map> 
<div id="links"> 
<a href="http://ab.com">ab</a><a href="http://xy.com">xy</a> 
enter code here 

的感謝！

Answer 1

試試這個：

$("a", "#links").hover(
     function() { 
     var state = $(this).text(); 
     $('area[state="' + state +'"]').mapster('select'); 

    }); 

這是當你將鼠標懸停與id="links"鏈接列表它得到積極的事件。 var這個狀態保持懸停的鏈接的文本，所以當你懸停<a href="ab.com">ab</a>，狀態ab。與選擇$('area[state="' + state +'"]')你可以找到它等於懸停的鏈接的文本狀態屬性的地圖區域元素。 mapster('select')最後突出顯示地圖區域。