Pop up boxes relative to window, not page

[pai]

Hi,

I’m trying to figure out how to make a popup div box to appear relative to the window, not the page. If you look at my site, when you click on a mugshot a popup bio box appears. Like so:

This looks great in the first two rows. When you get to the last rows, the bio boxes appears off screen. Like so:

This is because the bio boxes position are set to “Absolute” and centered to the page. Is there a way to set the boxes so that they open up relative to where you click on the mugshot? I can’t seem to figure it out.

Thanks!

Pai

---

Here is my public share link: Webflow - Oakland Ghost Ship deaths
(how to access public share link)

[zbrah (Mazette.co)]

Hum yes i have an idea !

Ok, so first put all your divs in a parent div set to relative

Now, put your relative div in another div set to fixed top.

Now i guess the idea is to fix the height of this Bio container div in pixel and positionn.

Scroll Overflow on Bio Container

and it’s working !

[zbrah (Mazette.co)]

Wow but designer is getting crazy when adding scrool overflow

Maybe too much for overflow, but i’m not sure it’s working perfectly in preview.

You can try to display none before animating, in the css panel not in initial appearance so designer won’t have to show every content. I guess

[pai]

You’re awesome. This worked. The site is at Remembering the Ghost Ship fire victims if you are curious.

[zbrah (Mazette.co)]

Yay great to hear Cool site Gj ! Maybe you want the close button to be fixed so people don’t have to scroll up to find it