这可能吗?我试图找到元素的 x 和 y 坐标相对于浏览器。
var position = $(this).position();
x = position.left;
y = position.right;
不起作用。
有什么办法吗?
<罢工>http://adamsaewitz.com/housing/罢工>
突出显示蓝色房间 070
最佳答案
问题在于您正在访问区域元素的顶部/左侧。
area 元素没有定位在它的坐标指示的位置。这是由 dom/浏览器在幕后处理的。
因此您需要找到区域
相关的图像并获取其偏移量。
var imgId = $(this).closest('map').attr('name');
var imgPos = $('#' + imgId).offset();
然后,您获取 area
的 coords
属性并将其拆分为 left
/top
/width
并使用它们来确定图像内的位置。
var coords = $(this).attr('coords').split(',');
var box = {
left: parseInt(coords[0],10),
top: parseInt(coords[1],10),
width: parseInt(coords[2],10)-parseInt(coords[0],10),
height: parseInt(coords[3],10)-parseInt(coords[1],10)
};
考虑到出现的信息框的宽度/高度(并且由于您对其进行了动画处理,因此也将其考虑在内),然后您将获得
x = imgPos.left + box.left + box.width/2 - 65; // 65 is the info width/2
y = imgPos.top + box.top -20 -160 -1; // 20 is the animation, 160 is the info height, 1 is a safe distance from the top
关于javascript - 获取 map 区域的位置(html)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4529957/