2011-12-26 27 views
5

<area>'un çevresine kenarlık koymanın bir yolu var mı?Bölgeye nasıl sınır koyulur?

Ben bir imagemap test etmek için bunu yapmak gerekiyor, ama bu işe yaramazsa:

area { 
    outline: 1px solid red; 
    border: 1px solid red; 
} 
+0

Belki bu eklenti http yardımcı olur. com/proje/maphilight –

+0

Bu bağlantı öldü. İşte bir başka: http://davidlynch.org/projects/maphilight/docs/ – Urbycoz

cevap

4

sen, Javascript kullanmak <area> element ve .focus()/.blur() için mouseover/mouseout olay dinleyicileri eklemek için istekli iseniz.

Demo: http://jsfiddle.net/ThinkingStiff/Lwnf3/

Senaryo:

var areas = document.getElementsByTagName('area'); 
for(var index = 0; index < areas.length; index++) {  
    areas[index].addEventListener('mouseover', function() {this.focus();}, false); 
    areas[index].addEventListener('mouseout', function() {this.blur();}, false); 
}; 

HTML:

<img id="map" src="http://thinkingstiff.com/images/matt.jpg" usemap="#map"/> 
<map name="map"> 
    <area shape="circle" coords="50,50,50" href="#" /> 
    <area shape="circle" coords="100,100,50" href="#" /> 
</map> 

CSS: //plugins.jquery:

#map { 
    height: 245px; 
    width: 180px; 
} 
+1

+1 Bu çok düzgün bir cevap! Tks. Bugün yeni bir teknik öğrendim. – techfoobar

+0

Bende! Yardım için teşekkürler! : D – timkl