html图像热区链接

【实例介绍】

html图像热区链接

          同一个图像的不同部分可以链接到不同的文档，这就是热区链接。要使图像特定部分成为超链接，就要在图像中设置“热区”，然后再创建链接，这样当鼠标移动到图像热区的时候会变成手的形状，当按下鼠标的时候，页面就跳转到或者打开设定的uRL。
         <map>定义一个客户端图像映射，图像映射(image．map)指带有可点击区域的一幅图像。<area>标签定义图像映射中的区域。<img>标签中的usemap属性与map元素的n锄e属性相关联，创建图像与映射之间的联系。

【基本语法】

【语法介绍】

【实例代码】

<img src="images/9956.jpg" alt="Planets" width="500" 
height="320" border="0" usemap="#planetmap" />
<map name="planetmap" id="planetmap2">
  <area shape="circle" coords="180,139,14" 
href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" 
href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="456,82,475,139" 
href ="sun.html" alt="Sun" /><area shape="rect" 
coords="452,143,471,187" href="#">
<area shape="rect" coords="446,193,471,243" 
href="#"><area shape="rect" coords="442,254,466,298" 
href="#"></map>
<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" 
href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" 
href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="457,130,476,187" 
href ="sun.html" alt="Sun" />
</map>

【代码分析】

area元素永远嵌套在map元素内部，area元素可定义图像映射中的区域。<img>中的 usemap属性可引用<map>中的id或name属性，所以我们应同时向<map>添加id和name属性，如图所示。

 【素材及源码下载】

请点击：html图像热区链接 下载本实例相关素材及源码