腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

java大数据

专栏作者

627

文章

443383

阅读量

29

订阅数

javascript当中Map Area Shape 和onmousemove的用法

例 4.2（MapAreaShapeMouseMoveIEFF.html） <html> <head> <title> img hidefocus="true"必须加,否则ie8中点击map后，会粗线一个contour，轮廓线</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script type="text/javascript"> function showTip(event,txt) { var newDiv = document.getElementById('newDiv'); newDiv.style.display="block"; //clientX是鼠标指针位置相对于窗口客户区域的 x 坐标 newDiv.style.left=event.clientX+10; //必须加上10，如果不加10的话，老会闪烁 newDiv.style.top=event.clientY+5; newDiv.style.position="absolute"; //必须指定这个属性，否则newDiv层无法跟着鼠标动 newDiv.innerHTML="<table class='my'><tr><td>" + txt + "</td></tr></table>";; } function closeTip() { var newDiv = document.getElementById('newDiv'); newDiv.style.display="none"; } </script> <style type="text/css">  </style> </head> <body> <div id="newDiv" style="display: none; z-index: 1;"> </div> <img hidefocus="true" src="markWeChat.jpg" border="0" usemap="#qixyplanetmap" /> <map name="qixyplanetmap" id="planetmap"> <area shape="circle" coords="200,50,50" href ="us.html" target ="_blank" alt="us" onmousemove="showTip(event,'想加微信 <br /> 必须得扫一下<br /> 否则是<br />加不上的<br />知道了吗')" onmouseout="closeTip()" onmousedown="" /> <area shape="rect" coords="0,0,100,100" href ="rect.html" target ="_blank" alt="rect" onmousemove="showTip(event,'想加微信 <br /> 必须得扫一下<br /> 否则是<br />加不上的<br />知道了吗')" onmouseout="closeTip()" onmousedown="" /> </map> < p><b>马克-to-win：注释：</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性（根据浏览器），所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p> a.矩形：必须使用四个数字，前两个数字为左上角座标，后两个数字为右下角座标

马克java社区

2019-11-27

5080

没有更多了

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态