Question

I’m trying to use an image map in <a> tag. It has worked in chrome but not hasn’t worked in IE. Is it okay to use an image map in <a> tag?

Here is my code:

<div class="planner_banner">
        <a href="xxx">
            <img src="xxx" usemap="#planner_banner_map" border="0">
            <map name="planner_banner_map">
                <area shape="rect" coords="243, 1, 272, 30" 
                onclick="$('.planner_banner').hide();return false;"/>
            </map>
        </a>
    </div>

Answer 1

可以在<a>标签中使用图片映射吗？

不。参见the specification：

a元素…内容模型：透明，但是必须没有交互式内容或元素后代。

interactive content被定义为：

一个音频（如果存在href属性）（如果存在controls属性）按钮细节嵌入iframe img（如果存在usemap属性）输入（如果type属性不在（隐藏状态）标签，选择textarea视频（如果存在controls属性）

Answer 2

在地图名称前添加#

<map name="#planner_banner_map">
  <area shape="rect" coords="243, 1, 272, 30" 
  onclick="$('.planner_banner').hide();return false;"/>
</map>

是否可以在<a> tag?

2 个答案: