CODEWITHSUNDEEP
cssz-index
user852974
user852974

Reputation: 2282

How to allow clicking on elements behind elements with a higher z-index

I would like to put a reflection over the entire page. I have a transparent png that fades from white to transparent and I would like it to fill the browser and be displayed above everything else but allow the user to click on everything behind it, not be able to be dragged, and work in all browsers. Is this possible?

Upvotes: 4

Views: 2404

Answers (2)

thirtydot
thirtydot

Reputation: 228182

You can use pointer-events: none, which works everywhere except IE10 and older.

A blog post with more information:

http://robertnyman.com/2010/03/22/css-pointer-events-to-allow-clicks-on-underlying-elements/

Upvotes: 9

maximumcallstack
maximumcallstack

Reputation: 2917

Why not make the content backgrounds transparent, or with transparent png's?

Or set the opacity for the content as if it's faded into the background. Not sure what you're trying to achieve though I'm sure you can get a similar effect if you try a new approach. From a design point of view I can't imagine how a div over the main content could create an effect not achievable via other methods.

Upvotes: 0

Related Questions