Utilisation de jQuery pour affecter une classe active à une balise de zone (carte image)

Question

Existe-t-il un moyen, via jQuery, d'affecter une classe active à une balise de zone dans une map?

J'ai un tas de domaines définis comme ceci:

<map name="mappy"> 
    <area shape="rect" coords="162,105,179,136" href="#" title="Unique Title 1" alt="Unique Title 1" /> 
    <area shape="rect" coords="205,72,222,101" href="#" title="Unique Title 2" alt="Unique Title 2" /> 
</map> 

Ce que je dois savoir est s'il est possible d'ajouter une certaine jQuery qui flaire la balise de titre ou alt et applique une classe active à la zone s'il y a un match.

Quelque chose comme ... if title="Unique Title 1" then add class="active" à la zone. Est-ce possible?

Answer 1

Vous pouvez utiliser le attribute-equals selector pour trouver et .addClass() pour faire le réel en ajoutant, comme ceci:

$("area[title='Unique Title 1']").addClass("active"); 

Answer 2

Je ne suis pas tout à fait sûr que je comprends parfaitement ce que vous demandez, mais cela peut le faire:

$(document).ready(function() { 
    $("map.mappy area").click(function() { 
     $("map.mappy area").removeClass("active"); //Make sure no other "active" classes exist 
     $(this).addClass("active"); //Add the active class to the area that was clicked 
    }); 
}); 

Espérons que vous vouliez ajouter la classe active dans un événement de clic, sinon, je suis sûr que cela pourrait être modifié facilement pour répondre à vos besoins (vol stationnaire ou tout autre événement que vous cherchez).