If an image’s width is given in % and we change the tab or window’s size it goes compressed or expanded accordingly because of the percentage width. But what about mapping on that image. It can not be given in %. Because its basically a collection of coordinates.
I will take an example of a poly area on an image.
<img src=”xx.png” style=”width:100%;” border=”0″ usemap=”#Map” id=”img” />
<area shape=”poly” id=”ar1″ coords=”107,64,170,65,192,87,
Basically there is an image with id “img” and on which a poly area is set as a link “xyz.html”.
the coords in the poly area is 107,64,170,65,192,87,196,124,
it is a collection of coordinates as x1,y1, x2,y2, x3,y3 ….., x9,y9
So there are 9 points or edges of that poly area on image which works as a link.
var basepolycoords = document.getElementById(‘ar1’)
var h = document.getElementById(‘
var w = document.getElementById(‘
var coords = changecoords(basepolycoords,w,
var arr = new Array();
arr = coords.split(“,”);
arr[i] = parseInt((newx/oldx)*arr[i]);
arr[i] = parseInt((newy/oldy)*arr[i]);
}var str = arr.join();
resizefunc();//called to adjust coords according to its initial window size.