Hello. I’m having problems with popups. I’ve got them each separate created specifically for each course (see section under the “The Platform. Digital Knowledge”) - when tapping on “preview course” 3 courses except the first one behave properly - each cta opens a correct popup with the right styling.
Now, while the first one opens the right popup with correct content, you can see that the BG is solid (due to rest of popups opening behind at the same time). I think I made animation giving a rule to close “all popups” when pressing X but it’s not how it’s supposed to be working. I have a feeling I messed something up with naming classes and that’s why the first one acts like this. Yet, I have no clue how to fix this issue. Perhaps someone could help me out on this?
Edit: the read-only mode doesn’t show behaviour, please see on preview mode.
Here is my site Read-Only: Webflow - Nowadays People
(how to share your site Read-Only link)
Not dived deep yet. But it looks like the issues are caused by the setting to affect “all elements with this class”, causing all popups open at the same time.
You may have to separate the popup divs to make each of them a sibling of each button.
Btw, nice website indeed.
Hi Anthony, thank you so much for the kind words, appreciate that!
Could you please elaborate more what you mean by “separating divs to make each of them a sibling”? I’m actually still quite new to Webflow and don’t really understand the workaround of this.
Your current setting in the interaction for Button 1 named “Open course 1 popup” will open all elements with the class “pop-up”. That’s why you will see all the four pop-up div showing up when clicking the Button 1.
Button 2 only affects the element with combo class .pop-up and .course-2 only, so it works as expected.
You can get it fixed by adding “Course 1” in the “Open course 1 popup” interaction for Button 1.
Woohoo! It worked! Thank you so much 
