单击部分透明图像上的透明区域 [英] Click through transparent area on partially transparent image

问题描述

给定一些形状，我希望它可以点击其填充的部分，而不是可点击（因此点击到它后面的元素）在其透明部分。以下是三角形形状的示例：
http://img138.imageshack.us /img138/1276/e4t.png

Given some shape, I would like it to be clickable on its filled parts, and not clickable (thus clicking through to the element behind it) on its transparent parts. Here's an example of a triangle shape: http://img138.imageshack.us/img138/1276/e4t.png

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

Black lines are bounding box lines. I would like to be able to select text, or interact with any element that is within bounding box (green-outlined areas), but not covered with the filled part.

我尝试SVG与指针事件设置为每个可能的值，但它似乎不工作。首选解决方案将使我们的html5，css和png图像，但每个工作的解决方案是欢迎。

I tried SVG with pointer-events set to every possible value, but it does not seem to work. Preferred solution would make us of html5, css and png image, but every working solution is welcomed.

推荐答案

pointer-event：none

pointer-event:none

注意：它只适用于现代浏览器

Note: it will work only to modern browsers

这篇关于单击部分透明图像上的透明区域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！