http://jsfiddle.net/RY9tk/520/
Burdaki örnekteki gibi area içerisin ID atanımlıyarak tıklayıp açmalı ve tıklayıp kapatmalı bir şekilde yapabilirsin.
örnek gösterecek olursak
<center><img src="TurkeySvg.png" usemap="#harita" ></center>
<map name="harita">
<area shape="rect" coords="1081,244,1227,347" href=""
id="open_popup" onmouseover="this.src='samsun.png';">
</map>
Arkadaşlar aşağıdaki şekilde çözdüm. Bu şekilde yapınca istediğim gibi mouse üzerine gelince istediğim görsel görünüyor.
<center><img src="TurkeySvg.png" usemap="#harita" ></center>
<map name="harita">
<a href="#" onmouseover="document.getElementById('tshirt').style.display='block';" onmouseout="document.getElementById('tshirt').style.display='none';">
<area shape="rect" coords="1081,244,1227,347" href="" onmouseover="this.src='samsun.png';"></a>
</map>Bu seferde şöyle bir durum oldu. Bu kodları normal bir html dosyası oluşturup baktığım zaman çalışıyor ama wordpress sayfa içerisinde html bölümünde kullanmak istediğim zaman kodlar çalışmıyor.