在圖片中標註usemap：

<img src=""img.jpg" usemap="im_map" />

定義map：

<map id="im_map" name="im_map">
<area shape="rect" coords="0,0,100,100" href="url.html" />
</map

map標籤定義map，area標籤定義可點選的熱點，area屬性：

shape：定義熱點形狀，可選引數 rect(矩形)、circle(圓形)、poligon(自定義形狀)。

coords：定義形狀路徑：

當shape=rect時，四個數字依次為：起點X、起點Y、終點X、終點Y

當shape=circle時，三個數字依次為：中心點X、中心點Y、半徑

當shape=poligon時，可定義多個路徑點，依次為：起點X、起點Y、路徑1X、路徑1Y、路徑2X、路徑2Y......

href定義點選跳轉的地址。

有時候需要動態的為coords屬性賦值，在JS中控制coords，demo使用JQ寫法：

var mapStartX = 0;
var mapStartY = 0;
var mapEndX = 100;
var mapEndY = 100;
var mapFill = mapStartX + ','+ mapStartY + ','+ mapEndX + ','+ mapEndY;
var im_map = $('#im_map').find('area');
im_map.attr('coords',mapFill);
 

完。