根本不是 Jquery 专家，但通常可以做我需要的……至少到现在为止。我正在一个网站上工作，该网站的主要导航将是 2 个图像 map ，一个用于美国，一个用于加拿大。为了节省屏幕空间，我们想将每个图像映射放入 Jquery Accordion 中。
问题是，第一个图像 map 工作得很好，但是当您打开第二个 Accordion (在本例中为加拿大)时，单击该图像会从下方的美国 map (来自现在折叠的美国 Accordion )中获取 URL
<div id="accordion">
<h2>UNITED STATES</h2>
<div class="center-text">
<img src="/usa.jpg" usemap="#map" />
<map name="map">
<area shape="circle" coords="479, 159, 10" href="/MD/"/>
<area shape="circle" coords="487, 126, 10" href="/NJ/"/
....
</map>
<h2>CANADA</h2>
<div class="center-text">
<img src="/canada.jpg" usemap="#map" />
<map name="map">
<area shape="circle" coords="49, 19, 10" href="/ON/"/>
<area shape="circle" coords="87, 16, 10" href="/AB/"/
....
</map>
</div>
</div>
显然(我希望)我已经删除了大部分区域标签。 设置 z-index 等的各种尝试均无效。有什么想法吗？
最佳答案
不敢相信我没有早点发现这一点... 为此，每个图像映射都需要一个唯一的 usemap 值
稍微更改第二张图像映射的代码，效果完美
<h2>CANADA</h2>
<div class="center-text">
<img src="/canada.jpg" usemap="#map2" />
<map name="map2">
关于jquery - Jquery Accordion 问题中的 2 个图像映射，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31944753/