<img/>没有使用imagemap

时间:2016-11-18 12:23:46

标签: html imagemap

我的图片拒绝使用我声明的图片地图。即使我删除了js函数调用。

<div id="content" class="position-absolute">
    <img src="img/label.png" alt="img/label2.png" usemap="#label1" id="label">
</div>

<!-- map -->
<map name="label1">
    <area shape="rect" coords="414,10,474,46" onClick="swapSrcAlt(label);">
</map>

我的JS供参考。

function swapSrcAlt(z) {
    if (typeof z === 'string') {
        var x = document.getElementById(z);
    } else {
        var x = z;
    }
    var src = x.src;
    var alt = x.alt;
    x.src = alt;
    x.alt = src;
}

这是我的CSS给我一个关于我的区域实际位置的参考点,我只是将鼠标悬停在它上面。

area {
    cursor:pointer;
}

上面几行,同样的方法似乎也很合适。

<img src="img/thing.PNG" usemap="#thing-map" class="position-absolute">

    <map name="thing-map">
        <area shape="rect" coords="98,328,141,374" onClick="hideShow('homescreen','settings')">
    </map>

1 个答案:

答案 0 :(得分:0)

这是缩放,我的图像是498x54,但缩小到310x34,因为我的容器宽度只有310px。

这导致区域标记中的坐标错误。