JQuery, как динамически окрашивать область

Question

У меня есть такая карта изображения

<map name="imgmap">
<area shape="poly" coords="63,10,64,38,89,37,91,10" href="#" id="x1"></map>

и как я могу динамически раскрасить эту область с помощью jquery, например

("#x1").color('red')

Answer 1

вы можете попробовать использовать плагин maphilight из jquery. он делает то, что вы хотите достичь - http://davidlynch.org/blog/2008/03/maphilight-image-map-mouseover-highlighting/

Answer 2

Первоначально я думал, что это может работать:

$("#x1").css("background-color", 'red')

Однако, при дальнейшем расследовании стало ясно, что не существует простого способа сделать то, что вы хотите.
Возможно, ваша цель может быть достигнута путем абсолютного позиционирования специальных изображений под вашим основным изображением и вывода их на $("#x1").hover().

Answer 3

используйте этот код .... надеюсь, это поможет вам ...

<script>
 $(function() 
 {
      $('.map').maphilight({
      fillColor: '008800'
 });
 var data = $('#id').data('maphilight') || {};

 data.alwaysOn = !data.alwaysOn;
 $('#id').data('maphilight', data).trigger('alwaysOn.maphilight');
 });