HTML5----热区（在图片img上第一超链接选区）

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"><title>热区</title>
</head>
<body><img src="imgs/bg.png" useMap = "#link-map"><map name = 'link-map'><area shape="rect" coords="47,307,351,413" href="http://www.baidu.com"><area shape="circle" coords="600,600,200" href ="http://www.jd.com" alt="Mercury" /><area shape="poly" coords="0,0,200,0,200,200,100,300,0,200" href="http://www.taobao.com"></map>
</body>
</html><!-- 热区：1、分类有矩形，圆形，多边形2、矩形只用两个对角的坐标3、圆形只要圆心坐标和半径4、多边形要按照连接顺序来排坐标-->

1、矩形的热区，当点击鼠标右键就可以出现这个选取

2、圆心热区

3、多边形热区

转载于:https://www.cnblogs.com/SunlikeLWL/p/7224937.html

HTML5----热区（在图片img上第一超链接选区）相关推荐

html5在线裁剪,HTML5 本地裁剪图片并上传至服务器（老梗）
很多情况下用户上传的图片都需要经过裁剪,比如头像啊什么的.但以前实现这类需求都很复杂,往往需要先把图片上传到服务器,然后返回给用户,让用户确定裁剪坐标,发送给服务器,服务器裁剪完再返回给用户,来回需要 ...
html5图片区域剪切,HTML5 本地裁剪图片并上传至服务器（老梗）
很多情况下用户上传的图片都需要经过裁剪,比如头像啊什么的.但以前实现这类需求都很复杂,往往需要先把图片上传到服务器,然后返回给用户,让用户确定裁剪坐标,发送给服务器,服务器裁剪完再返回给用户,来回需要 ...
html5在图片中加链接,JavaScript、html5、canvas实现图片上画超链接
本文主要为大家详细介绍了JavaScript html5 canvas实现图片上画超链接,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能帮助到大家. 1. html 2. javascrip ...
使用jQuery开发一个基于HTML5的漂亮图片拖拽上传web应用
昨天我们介绍了一款HTML5文件上传的jQuery插件:jQuery HTML5 uploader,今天我们将开发一个简单的叫upload center的图片上传程序,允许用户使用拖拽方式来上传电脑上 ...
LocalResizeIMG前端HTML5本地压缩图片上传，兼容移动设备IOS,android
LocalResizeIMG前端HTML5本地压缩图片上传,兼容移动设备IOS,android jincon 发表于 2015-02-26 18:31:01 发表在: php开发 localresiz ...
[html] 如何使用html5进行图片压缩上传？
[html] 如何使用html5进行图片压缩上传? 1.获取到图片的base64格式: 2.图片加载完成后,把图片转化为canvas: 3.使用canvas的toDataURL按照自己的需要进行压缩: ...
html5拖拽图片批量ajax无刷新进度上传
1.前端拖拽图片之前有篇文章说到HTML5的拖拽(drag.drop,详见:/post/jquery-plugin-1-jquery-drag-and-html5-draggable-api-and ...
html字母上方加箭头,html5怎么在图片上加左右箭头
html5怎么在图片上加左右箭头0 html5怎么在图片上加左右箭头 a[href]{font-size:25px;}a[href][id]{background-color:black;... ht ...
php+点击图片跳转网页,怎么在图片上加超链接点击图片跳转到指定网页
在一些论坛.博客或者是一些网站浏览图片的时候会发现一个问题,就是当你不小心点击某一张图片后会自动跳转到另一个网页的界面,这样做的目的其实是为了宣传.推广该网页,也达到一个引流的效果,我们也可以利用这样 ...

HTML5----热区（在图片img上第一超链接选区）

HTML5----热区（在图片img上第一超链接选区）相关推荐

最新文章

热门文章