如何突出显示/可点击图像的不规则形状联锁拼图

Question

我试图在将鼠标悬停在图像上时突出显示/使其可点击特定的连锁部分（类似于拼图）。考虑到碎片的不规则形状，有没有一种方法可以实现这一目标？我使用图像贴图进行了探索，但它似乎仅限于矩形、多边形或圆形形状。这是我正在使用的图像。我的目标是当用户选择特定部分时突出显示绿色、紫色和蓝色部分，同时调暗其他部分。

Answer 1

您可以放置常规矩形 HTML 元素，并在其上使用所需形状的 SVG 路径的 clip-path。您可以使用 SVG 编辑器创建形状并将路径代码复制到剪辑路径中。