问题描述
我制作了一张图片地图,并且它在Firefox中不工作。它可以在Chrome和Safari中正常工作。
Ive made a image map and its not working in firefox. It works fine in both Chrome and Safari.
这是网站
bryanedwardcollins.com
This is the sitebryanedwardcollins.com
请帮助!
<MAP NAME="menumap" >
<AREA
HREF="contact.html" ALT="contact"
SHAPE="POLY" COORDS="425,100, 572,89, 594,142, 488,150, 460,166, 423,100">
<AREA
HREF="insameit.html" ALT="insame i.t."
SHAPE="POLY" COORDS="382,239, 462,245, 461,343, 608,344, 610,395, 354,405, 354,341">
<AREA
HREF="floorpart.html" ALT="floor part"
SHAPE="POLY" COORDS="307,185, 429,185, 430,221, 379,222, 374,235, 283,224">
<AREA
HREF="iouse.html" ALT="I O Use"
SHAPE="POLY" COORDS="27,18, 231,16, 243,0, 382,0, 253,265, 69,252, 193,73, 27,73">
<AREA
HREF="worldpart.html" ALT="world part"
SHAPE="POLY" COORDS="25,303, 122,305, 122,448, 27,449">
</MAP>
推荐答案
我偶然发现了这个问题。看起来,Chrome会解析img属性usemap =mapName而不使用#符号。但是,如果您不包含哈希符号'#',则该地图将不会与FireFox和Internet Explorer上的图像相关联。
I stumbled into this issue as well. It seems that Chrome will parse the img attribute usemap="mapName" without the # symbol. However, if you don't include the hash symbol '#', the map will not be associated with the image on FireFox and Internet Explorer.
以下是正确的方法要做到这一点:
Here is the correct way to do it:
<img src="images/header.jpg" id="hdr" name="hdr" usemap="#hdrMap" alt="alt string here" border="0">
<map name="hdrMap" style="cursor:pointer;">
<area shape="rect" coords="720,65,880,0" href="http://www.thisisthefirstlink.com" target="_blank" alt="first link alt">
<area shape="rect" coords="882,65,1024,0" href="http://www.secondlink.com" target="_blank" alt="second link alt">
</map>
注意usemap =#hrdMap有一个哈希标记符号并匹配name =hdrMap属性为地图标记。这看起来有点令人困惑,因为很多人将#符号与引用id属性相关联。
Notice the usemap="#hrdMap" has a hash tag symbol and matches the name="hdrMap" attribute for the map tag. This can seem a little confusing because a lot of people associate the # symbol with referencing an id attribute.
希望这可以帮助
这篇关于图像地图在Firefox中不起作用!在Chrome + Safari中运行良好的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!