HTML中实现触碰一张图片区域有字出现area

1、首先，先用img标签放一张图片，链接完图片之后，在img标签上加一个usemap属性，例如<img src="test/pig.gif" alt="pigmap" usemap="#pigmap">

2、加地图标签，用map标签是实现  设置name， name的属性值和usemap属性值相对应，去掉#符号。例如<map name="pigmap">

3、在map标签下添加一个子标签<area>，设置shape属性，即形状，例如“react”，用coords的属性值来控制要触发事件的范围，设target值为“_blank”

4、再在area标签中添加触碰事件onmouseover

5、再在下一个父标签中添加一个标签  设置id值。例如<p id="demo3">

6、然后绑定事件

function writeText(txt){    document.getElementById("demo3").innerHTML=txt;}