Last Updated: February 25, 2016
· dannygarcia

Ignore hover events with CSS

The pointer-events CSS property will allow you to control under what circumstances (if any) a particular graphic element can become the target of mouse events. (<a href="">source</a>).

This is a great way to build CSS tooltips that hide when moused over.

.tooltip {
    /* Prevents .tooltip from receiving pointer events. */
    pointer-events: none;

<a href="">jsFiddle Demo</a>