jquery mapster
HTML
<script src="https://rawgit.com/jamietre/ImageMapster/master/dist/jquery.imagemapster.min.js"></script>
<img id="myimage" class="map" src="http://cdn.iphoneincanada.ca/wp-content/uploads/2013/05/unnamed.png" usemap="#mark">
<map name="mark">
<area id="nao" shape="rect" coords="10,10,50,50" href="#">
<area id="nao1" shape="rect" coords="20,20,100,100" href="#">
</map>
JavaScript
$('#myimage').mapster({
staticState: true,
fillColor: "d42e16",
stroke: true,
strokeColor: "ff0000",
strokeOpacity: 1.0,
strokeWidth: 2,
render_highlight: {
fillOpacity: 0.5,
fillColor: "FFeedd",
stroke: true,
strokeOpacity: 1.0,
strokeColor: "FF0000",
strokeWidth: 2
}
});