Tomer Hadad Tomer Hadad - 11 months ago 45
HTML Question

Can an HTML element be both displayed and ignored?

I am trying to draw SVG lines over HTML elements, while:
1. The lines should be above the elements.
2. The elements should be clickable and selectable, meaning, the SVG does not cover the elements in terms of being able to click or select them.

As the z-index of lines cannot be configured separately from the z-index of the SVG (from what I know), the only way I thought about is to give the SVG a high z-index but set it to be ignored in terms of disrupting the elements beneath.

Is this possible?
Any other ideas how to implement the lines over elements without disrupting the ability to click and select them?


Answer Source

You can add following css to SVG lines.

pointer-events: none;