How change image map area element style

Question

I'm using image map on my web page and iPad app. Each area on the image map is a clickable element to make sound, which I can do easily with jQuery. But I haven't been able to change the style, like either showing the border, or change the fill color just to indicate that the area is clicked. If anybody has done this, please let me know; it seems simple, but I'm really stumped.

Solution

I got it to work thanks to James Treworgy's awesome ImageMaster Jquery plugin.

$('area').mousedown(function(e) {
   $(this).mapster('set',true);
});

$('area').mouseup(function(e) {
   $(this).mapster('set',false);
});

$('area').bind( "touchstart", function(e){
   $(this).mapster('set',true);
});

$('area').bind( "touchend", function(e){
   $(this).mapster('set',false);
});

Comments

[David Zhao]

thanks for the quick reply, my code is in the comments. $(this).css('...') doesn't work.

[Amit]

I tried to use your code but it is giving me some error.. i useed the plugin too. but still not working..the console is showing this error TypeError: $.mapster_when is undefined defer: $.mapster_when.defer,

[DRAJI]

@Amit Have you fixed TypeError: $.mapster_when issue.I too facing this same issue. Could you help me to retrive this error?