javascript - 图像映射适用于 Internet Explorer,但不适用于 Chrome

标签 javascript html google-chrome firefox internet-explorer-11

我使用下面的代码设置了一个带有图像映射的页面。该映射适用于 Internet Explorer 10、11、Edge 和 FireFox,但不适用于 Chrome。知道我缺少什么吗?

<center><img src="Live View.png" width="1024" height="768" border="0" 
usemap="#map" /></center>
<map id="Map" name="Map">
<area shape="rect" coords="530,50,650,100" href="live view.html" target="_self" />
<area shape="rect" coords="662,58,821,118" href="Setup.html" target="_self" />
<area shape="rect" coords="315,550,370,520" href="1x1.html" target="_self" />
<area shape="rect" coords="390,550,445,520" href="2x2.html" target="_self" />
<area shape="rect" coords="455,550,505,520" href="3x3.html" target="_self" />
<area shape="rect" coords="525,550,650,520" href="fullscreen.html" target="_self" />    
</map>

最佳答案

您的 ID 不匹配。您在图像元素中引用了 #map,但您的 map ID 为 Map。标识符区分大小写。

修复 ID 后,Chrome 中一切正常:

<center><img src="http://via.placeholder.com/1024x768" usemap="#map"></center>
<map id="map" name="map">
<area shape="rect" coords="530,50,650,100" href="live view.html" target="_self" />
<area shape="rect" coords="662,58,821,118" href="Setup.html" target="_self" />
<area shape="rect" coords="315,550,370,520" href="1x1.html" target="_self" />
<area shape="rect" coords="390,550,445,520" href="2x2.html" target="_self" />
<area shape="rect" coords="455,550,505,520" href="3x3.html" target="_self" />
<area shape="rect" coords="525,550,650,520" href="fullscreen.html" target="_self" />    
</map>

关于javascript - 图像映射适用于 Internet Explorer,但不适用于 Chrome,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45579921/

相关文章:

javascript - Angularjs - 有没有办法以编程方式点击 HTML <select> 元素?

javascript - IE 无法正确比较日期字符串

javascript - 如何将 document.body 的所有子级放入包装器中?

javascript - JS 使用正则表达式替换

google-chrome - 每个 Chrome 用户都有唯一的 ID?

javascript - Internet Explorer 9 中的类型不匹配错误 : adding a &lt;title&gt; to inline SVG

javascript - 将 phpFox 的功能导入 SocialEngine

jquery - 时间间隔设置 CSS 类

google-chrome - 从不调用 Chrome 扩展 onSuspend

Chrome 中的 CSS rgba 透明度错误?