Image Map 在 Internet Explorer 中可用，但不可用 Chrome

Question

我已经使用以下代码设置了一个带有图像映射的页面。该映射适用于 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>

Answer 1

您的 ID 不匹配。您在图像元素中引用了 #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>

Image Map 在 Internet Explorer 中可用，但不可用 Chrome

Image Map works in Internet Explorer, but not Chrome

html

javascript

firefox

google-chrome

internet-explorer-11