Streaming live at 10am (PST)

Can you add text hover over an image/video when it is inside lightbox links


#1

Hi, I want to figure out how to put text when I hover over an image on a Lightbox list.
I heard to do it is from doing interaction. Can anyone help me figure out how to do this or do I need coding to do something like that?

@PixelGeek I saw one of your video that has a lightbox hover with text but in the tutorial, you were teaching on adding pictures. I want to know how you can add some text to the lightbox when I hover over, thank.

Thanks
Pauline


Here is my public share link: LINK
(how to access public share link)


#2

Hi @Pauline_S_McNaughton an welcome to the Webflow Community! :grinning:

Yes this is possible…
Here’s a quick video for you on how to do that.

CloudApp

Hope that helps


#3

Hi Mark,
I did it and it works but I want to add a dark overlay over the image so i can see the text better how do i do that. I added a div block with the text but the div block i currently made it’s a black with opacity of 50% which making my whole image dark as well. I want hover in and out the image with the text and black overlay together.

What should i do when i want to hover an image with a dark overlay with text block?
Thank you!!!


#4

Do you want the overlay to fade in on hover too?


#5

Yes, with the text together

Currently, the text is fading in and out when over which is great but I can see it clearly when my image is a bit busy so I wanted to have a dark overlay under the text so I can see the text better when I hover over the image.


#6

You can use interactions 2.0 to animate many elements on the same trigger quite easily now (once you get used to it!)

Here’s how to add the overlay and animate it too.
CloudApp


#7

Thank you, you’re a lifesaver!
It really helped, I wouldn’t have figured that out.

Also, I want to ask if I can copy and paste multi-image of the same one with the interaction attached?
I tried but it doesn’t work but the interaction icon is there tho.

Thanks again!
Pauline