javascript当中Map Area Shape 和onmousemove的用法
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"> <!-- .my { font-size: 13px; color: #000000; background-color: #99CC99; padding: 3px; } --> </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.矩形：必须使用四个数字，前两个数字为左上角座标，后两个数字为右下角座标
更多请见：https://blog.csdn.net/qq_43650923/article/details/102591587
本文系转载，前往查看
如有侵权，请联系 cloudcommunity@tencent.com 删除。
本文系转载，前往查看
如有侵权，请联系 cloudcommunity@tencent.com 删除。