Question

I want a sort of overlay after clicking on a button. This is how it looks before the triangle at the bottom is clicked:

Then after it is clicked, it should look like this:

I feel this can be done with jQuery, but I haven’t figured it out yet. Can someone point me in the right direction?

Answer 1

As a ballpark answer (based on what info has been given…), I would suggest making a absolutely positioned (and sized!) div that appears over the top of the content (don’t worry about the show/hide bit just yet…

Once you’ve got that nailed and where you want it.

then a click event using:

$('selector').toggle()

will manage the showing and hiding of it.

To start it hidden, for the CSS of the element, give it a display:none; – Jquery will add a Display:block on showing the element which will then override the property in the CSS file.