图象地图
图象地图分为: 客户端图象地图,服务器端图象地图.但是现在服务器端图象地图已经被前者给淘汰了.什么是图象地图?把一幅图象
分成多个区域,每个区域指向不同的URL.例如:把一幅中国地图的图象按照省份划成若干区域,这些区域被称为热点区域,点击热点区域就
可以链接到相关的地方,这就是图象地图.
知道了概念,那怎么样产生图象地图呢?
1> 必须定义出图象上个热点区域的形状,位置坐标,及指向的URL地址信息,这个过程叫图象热点映射.图象热点映射需要使用<map nam
e=mapname></map>标签进行说明.其中name属性为该图象热点映射指定了一个名称.
2> 图象热点映射中的各个区域用<are>标签说明,<area>标签的格式为: <area sharp="形状" coords="坐标" href=url>,也可以
nohref替换href,表示该区域单击鼠标无效.<area>标签还可以有个target属性,用来指名浏览器哪个窗口或侦中显示href属性所
指向的资源.
3> 定义好图象热点后,接着就要在<img>图象标签中增加一个名为usemap的属性设置,usemap属性指定该图形被用做图象地图,其设置
值为所使用的图象热点名称.
eg:
<img src="logo.gif" border="0" usemap="#mymap">
<map name=mymap>
<area shape="rect" coords="0,0,50,50" href="a.html">
<area shape="rect" coords="50,0,100,50" href="b.html">
<area shape="rect" coords="100,0,150,50" href="c.html">
</map>
sharp属性的设置说明:
.rect 定义一个矩形区域,coords属性设置为矩形的左上角,右下角的坐标,各个坐标之间用逗号隔开.
.poly 定义一个多边形区域,coords属性设置为多边形个顶点的坐标值.
.circle 定义了一个圆形区域,coords属性设置为圆心坐标及半径,前两个参数分别为圆心的横,纵坐标,第三个参数为半径.
eg:
<map name="mymap">
<area sharp="rect" href="a.html" coords="140,20,280,60">
<area sharp="poly" href="b.html" coords="80,100,60">
<area sharp="circle" href="c.html" coords="100,100,180,80,200,140">
</map>