How to create a staggered gallery with text on hover

Design help General
1

Hello :slightly_smiling_face:

I am very new to Webflow and am getting really frustrated with creating a certain gallery. I googled & watched multiple tutorials but cannot figure out what I want. So basically I am trying to create a 2 column gallery that is staggered, so while the width of the images should be the same (based on the two columns), I want the height to be different and it should not line up with the images next to each other. I was able to achieve that effect, but my issue is that I want text to reveal on each image when hovered over it. Technically, I know that the div holding the image should be set to relative and the heading then to position absolute, but I can’t seem to combine the two column, staggered gallery with having a heading on each picture that appears on hover. Here’s a gallery that’s similar to what I am trying to achieve Kundenprojekte & Case Studies - hy.am studios

Can anyone help me here??

Thanks a lot!! Jana

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hello.
Sharing the link to your Webflow website give others a change to see whats going on. Text only is sometimes not enough to help.

1 Like
3

Hi, there’s nothing to show on my website yet, since I do not know how to create this kind of gallery. That’s why I provided a link in my original post that exactly shows what I am trying to create.