我在网页上有一张图片(比如美国 map )，下面有各种链接(比如州名)(与图片分开)。
当我点击州名称链接时，图像(美国 map 图像)中的该州区域应该突出显示(或更改颜色等)。
我看到的所有示例都是关于当您将鼠标悬停在图像区域本身上时突出显示图像区域，但我想单击一个单独的链接，从而突出显示图像区域。
请提供代码示例或想法的建议...
我的问题与此类似:
Highlight Section of Mapped Image when Mouseover Text on Webpage
但我不明白那个……
最佳答案
鼠标悬停时突出显示的 map 区域已由 jquery.maphilight.js 提供。有很多关于其在图像本身上使用鼠标悬停突出显示的示例。
要从单独的文本链接中突出显示图像区域，我们可以这样做:
假设您的图像映射是:
<map name="mymapname">
<area id="myAreaId" href="#" shape="poly" coords="32,71,116,77,142,81,145,125,34,
106" alt="Link" title="Default behavior">
...
</map>
然后，您可以从 href 链接模仿图像区域的鼠标悬停:
<a id="mylink" href="#" onmouseover="$('#myAreaId').trigger('mouseover');"
onmouseout="$('#myAreaId').trigger('mouseout');">My Link</a>
这不是最简洁的解决方案，但可以完成工作。
关于javascript - 突出显示图像区域 - 单击链接时，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17608182/