html点击图片某区域进行操作

html开发中可能会需要用到点击一张图片的某区域进行跳转操作。例子如下：

 

<img   src= "../Images/img.gif "   width= "777 "   height= "100 "   border= "0 "   usemap= "#Map ">

<map   name= "Map ">

    <area   shape= "rect "   coords= "600,1,700,40 "   href= "../../a.html ">
    <area   shape= "rect "   coords= "x1,y1,x2,y2 "   href= "../../b.html ">
</map>
 

 

shape="rect"，属性表示：矩形区域（还有圆形和多边形具体可以查w3c）；

coords="x1,y1,x2,y2"，属性表示：（x1,y1）矩形为左上角顶点座标，（x2,y2）为对角顶点。

 

点击图片的某区域，可以增加一些操作，如转跳到另一个页面，在href中填入需要跳转的页面即可。

 

shape属性其它值如下表：

 

值	描述
default	规定全部区域。
rect	定义矩形区域。
circle	定义圆形。
poly	定义多边形区域。