指定图片某块区域加超链接 (热点)

设置图片热点链接以及获取图片上某个位置的坐标

给一大张图片，指定区域加链接，使用map标签可以实现。

原来都是用Dreamweaver，直接切换到设计模式画出来的，如下：

不用dw怎么实现呢？只需要知道图片指定位置的坐标就可以了。

示例代码：

<img src="test.jpg"  usemap="#testmap" alt="test" />
<map name="testmap" id="testmap">
  <area shape="circle" coords="180,139,14" href ="test1.html" alt="test1" />
  <area shape="circle" coords="129,161,10" href ="test2.html" alt="test2" />
  <area shape="rect" coords="0,0,110,260" href ="test3.html" alt="test3" />
</map>

注释：shape="rect"为矩形热点，coords="x1,y1,x2,y2"对应的坐标是左上角和右下角的坐标

shape="circle"为圆形热点，coords="x,y,radius"对应的是圆心的坐标和半径

现在只需要知道如何获取坐标就可以了。

新建一个html页面，在body里面插入如下代码：

<a href="#"><img src="test.jpg" ismap="ismap"></a>

Chrome，360浏览器：左下角没有相应坐标显示，但是通过鼠标点击也是可以获取到

参考网址：https://blog.csdn.net/qq_42450386/article/details/103576372

https://blog.csdn.net/flqbestboy/article/details/76566414