How do I create this effect?

Hi, I’m rather new to webflow, and was wondering if (and how) it is possible to achieve an effect similar to the following ones?
https://spinachdesign.com/disciplines/
When hovering over the panels the box pops up with more information.
I want to achieve a very similar effect, except I want the information box to cover the entire thumbnail, minus a border.

Every input is appreciated!


Easy! (it’s not easy without watching a few Webflow tutorials first!)

you need 3 divs

  1. first div set to position:relative
  2. 2 divs inside of that set to position: absolute 0% all round

one of those divs is the topic card which you can see all the time, and has the hover over interaction
the other div is the one that pops up, which is where the interaction happens.

take a look at the webflow university - check out some of the terms I’ve used and play with it. You’ll get frustrated at first, but you can always share a read only link of your progress.

1 Like

found the right tutorial, exactly what i was looking for.
Thank you!

1 Like