Question

I want to make a div with position:fixed that will overlap the content, but not clickable, i.e. when you click in that div’s area you are clicking on the content under it. So the text under the div could be easily selected. Is there a way to do that?

Answer 1

The solution is to add pointer-events: none; to the CSS of the overlaying div. This will cause any all events to pointer events to ignore the overlaying div.

This is demonstrated here: http://jsfiddle.net/nayish/7hHvL/.

You’ll notice that the alert, which is set only for the bottom div, works also when clicking on the overlaying div.