部分透明图像中的透明区域可点击吗？

Question

部分透明图像中的透明区域可点击吗？

javascriptcsshtmlsvgpng

5

给定某个形状，我希望它在填充部分可点击，在透明部分不可点击（因此可以点击到其后面的元素）。这里是一个三角形的例子：

。

黑色线条是边界框线条。我想选择文本，或与任何在边界框（绿色轮廓区域）内但未被填充部分覆盖的元素进行交互。

我尝试了将pointer-events设置为每个可能的值的SVG，但似乎不起作用。首选解决方案将利用html5、css和png图像，但每个有效的解决方案都受到欢迎。

- Mars

我相信你会在以前的问题中找到答案：http://stackoverflow.com/questions/4621305/how-do-i-create-a-click-map-using-the-visable-area-of-a-png-image-with-javascrip - Nicklas Nygren

那个先前的问题链接指向 https://dev59.com/G1fUa4cB1Zd3GeqPEAgk - Thilo

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Chetan bane · Accepted Answer

你可以添加样式属性

pointer-event:none

到图片上，它将通过图像来帮助你。

注意：这仅适用于现代浏览器。