5

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: enter image description here

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.

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.

2

1 Answer 1

1

You can add style property

pointer-event:none

to Image it will help you out through the image

Note: it will work only to modern browsers

1
  • The question is about click-through on transparent areas of an element only. But "pointer-event: none;" makes the entire element click-through.
    – Oktokolo
    Aug 9, 2022 at 18:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.