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?
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.
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”.
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!
Hey, since the solution for this is not obvious from this thread (and neither the problem so much), is using dynamic modals/popups described somewhere in Webflow University or another topic? Thanks!
