AREA标签的offsetLeft和offsetTop值在IE中有效，但在Chrome和Firefox中显得不合适

Question

我有一张简单的图片地图：

<img alt="Image" src="./TestImage.jpg" usemap="#myMap" />
<map name="myMap" id="myMap">
    <area id="Fox" alt="Fox" shape="rect" coords="344,0,530,170" />
    <area id="Grass" alt="Grass" shape="rect" coords="80,160,250,280" />
</map>

我使用jQuery附加mouseover事件处理程序：

$(window).load(function () {
$('div map area').mouseover(function (e) {
    ...
}

我检查元素的偏移量：

var offset = $(this).offset();

当我将鼠标悬停在Fox AREA上时，我看到以下内容：

• IE返回正确的值：（344,0）
• Chrome告诉我偏移量是（0,0）
• Firefox告诉我偏移是（8,76,8333 ......）

为什么Chrome和Firefox会返回错误的值，我可以采取哪些措施来解决此问题？

Answer 1

您可以直接获取“coords”属性：

var coords = $(this).attr('coords').split(',');