html里的map标签怎么用

Posted 2023-05-16

参考技术A

<map>常用在为图像的某区域添加超链接！

用法如下：

<img src ="planets.gif" alt="无法显示此图像" usemap ="#planetmap" />

 

<map id ="planetmap" name="planetmap">

<area shape ="rect" coords ="0,0,82,126" href ="sun.htm" alt="Sun" />

<area shape ="circle" coords ="90,58,3" href ="mercur.htm" alt="Mercury" />

<area shape ="circle" coords ="124,58,8" href ="venus.htm" alt="Venus" />

</map>

usemap属性获取<map>标签信息，<area> 标签定义一个链接区域，shape属性定义区域形状，coords属性定义链接区域的起点坐标和终点坐标，又不懂的可以hi我！

本回答被提问者和网友采纳

HTML map标签area 属性，当鼠标移动到area上面的时候，对应的区域边框的的变大，前变色怎么办？谢谢啊

参考技术A function inArea(img)
var id = '_$area$_', pos = this.coords.split(','), area = document.getElementById(id);
if (area) outArea(area);
area = document.createElement('a');
area.id = id, area.href = this.href, area.target = this.target, area._area = this;
pos[0] -= 0, pos[1] -= 0, pos[2] -= pos[0], pos[3] -= pos[1];
with (area.style)
position = 'absolute';
left = img.offsetLeft + pos[0] - 1;
top = img.offsetTop + pos[1] - 1;
width = pos[2];
height = pos[3];
border = '1px solid #ff0000';

area.onmouseout = function() outArea(area);
document.attachEvent ? this.parentNode.appendChild(area) :
this.parentNode.replaceChild(area, this);

function outArea(elem)
document.attachEvent ? elem.parentNode.removeChild(elem) :
elem.parentNode.replaceChild(elem._area, elem);

window.onload = function()
var map, areas, j, i = 0, imgs = document.images;
for (; i < imgs.length; i++)
map = imgs[i].useMap;
if (map) if (map = document.getElementById(map.slice(1)))
areas = map.getElementsByTagName('area');
for (j = 0; j < areas.length; j++)
areas[j].onmouseover = (function(img)
return function() inArea.call(this, img);
)(imgs[i]);

;
本回答被提问者采纳