CSS properties - pointer-events

revision:

pointer-events property

- defines whether or not an element reacts to pointer events.

CSS syntax : pointer-events: auto|none;

Property values:

auto : the element reacts to pointer events, like :hover and click. This is default.

none : the element does not react to pointer events.

initial : sets this property to its default value.

inherit : inherits this property from its parent element.

JavaScript syntax: object.style.pointerEvents="none"

example: pointer-events property

Move over the links below to see if they react on pointer events.

pointer-events: none:

Go to my website

pointer-events: auto (default):

Go to my second website
code: 
                    <div>
                        <p>Move over the links below to see if the react on pointer events.</p>
                        <h4>pointer-events: none:</h4>
                        <div class="ex1">Go to <a href="https://www.lwitters.com">my website</a></div>
                        <h4>pointer-events: auto (default):</h4>
                        <div class="ex2">Go to <a href="https://www.lwitters-1.com">my second website</a></div>
                    </div>
                    <style>
                        div.ex1 {pointer-events: none;}
                        div.ex2 {pointer-events: auto;}
                    </style>