Geek Answers Handbook

How to change map card element style

I use an image map on my webpage and iPad app. Each area on the image map is an interactive element for creating sound, which I can easily make using jQuery. But I was not able to change the style, for example, either show the border or change the fill color to indicate that this area is clicked. If anyone has done this, let me know; it seems simple, but I'm really at a standstill.

+4
source share
2 answers

I got it to work thanks to James Truorgi amazing 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); });
+6
source

It's hard to say without seeing the code, but just as you refer to parts of a map, just as you apply styles.

If you have section1 then you css could be

 #section1{ border://something background-color://something else }

Or, in your script, when you link to a click, you also add some styles, like

 $('#section1').click(function(){ //whatever $(this).css({'background-color' : 'red', 'border' : '1px solid black'}); });
-1
source

More articles:


All Articles