How to change background of revealed text or create an overlay/backdrop of some sort?

Elements
1

Hi Guys, looking for some help for a noob (me) on the following:

I have a grid cell with a container within it and an image I want to be shown…no problem so far.
However, I want a small text box to appear when the image or its container is hovered over. I have tried with a modal, but am struggling with its size and positioning. I have also tried using a reveal in a new container, but not succeeded - What I want is the original image background to be blurred/made less opaque behind the revealed text, or to have an off-white/grey background, whose opacity I can reduce to say 40 or 50%. I have somehow achieved this using blur on the back image (somehow?) but it doesn’t appear in the web preview? I think I need to give a reduced opacity background to the text, or its container (somehow)? Anyone out there able to help?

2

@Mike-Grant

not sure if this is what you mean project -elementsapp://downloadDocument/DM5nMlUIAu5r

1 Like
3

Thank you Steve, you always answer my requests for help, it’s very kind. I did manage to find a solution, a cheat really, but it did work - I just left second well empty, so no background was shown - my page is white, so it just looked like a backdrop of paper as the first picture was removed. A far less eloquent solution than you designed.

4

not quite sure what you did, does dark mode effect this for other people, I am always in dark mode

5

I have Dark Mode disabled…so not sure, but as long as it works

Thanks as always, for your time and help that you offer.