Streaming live at 10am (PST)

Creating a custom modal to pop up with dynamic content from CMS

Hi there!

I’m trying to create a custom modal pop up for popping up a bio on a click of the image. I have placed the image in a link block and when I click on it, a pop up modal shows up with the bio.

What is happening is, when I click the image, both the teammates’ bio shows up and then I’m absolutely not able to click out of the second one.
I want just the relevant teammates’ bio to pop up and to be able to close it.
How can I achieve this?

Here is the link - https://preview.webflow.com/preview/fscl?utm_medium=preview_link&utm_source=designer&utm_content=fscl&preview=945fcd85995acefdeafd723543240a0c&pageId=5f247143cf2bd51518fbb823&mode=preview


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

You need to restrict the click action to the relevant bio popup. At the moment, your IX action is targeting ALL of the elements named .bio-wrapper, that’s why they all show up.

image

Unfortunately you can only limit to children (elements inside of the trigger element), siblings (elements at the same level than the trigger element) or parent (element that are, well, the parent.)

In your actual structure, the .bio-wrapper element is neither of those, it’s a sibling of a parent.

So you have to move your popup element inside of the .team-card element, and restrict the action to “sibling”.

And now you master IX even more :slight_smile:

Hi,
Thank you for the tips. I did drag the bio wrapper inside the team card and changed its interactions to affect siblings, but it still doesn’t work. Can you please check if I’m missing something.
I really hope I can master this!