CODEWITHSUNDEEP
javascripthtmlcsstransparent
cslavoie
cslavoie

Reputation: 216

Is is possible to have a semi-transparent layer over another one without blocking/catching clicks in CSS/JS

Basically, I want to have a layer on top of another without catching input.

The goal is to have a PNG over my webpage that will create an effect, a bit like a filter.

My problem is if it’s over, the text becomes unselectable & unclickable.

Any ideas?

Upvotes: 0

Views: 404

Answers (1)

jondavidjohn
jondavidjohn

Reputation: 62402

It depends on your needs, but in the past when there was a specific element that I wanted to be able to click through a layer. I would position a transparent div absolutely positioned to the exact position as the underlying that would trigger the event for the underneath element. It is very easy to match positions with javascript and just set the z-index higher than the overlay.

Of course this is easy If you are dealing with a single element or even two, could get exponentially cumbersome to use this for an entire page under an overlay for example.

Upvotes: 1

Related Questions