I followed this tutorial to create a modal https://university.webflow.com/article/popup-modal-in-webflow-using-interactions but the close button isn’t working when I preview in the interactions panel it shows correctly but when I preview the entire site or the published link it doesn’t work.
Yo can activate it clicking in the dog or the text that says Puppies. I have to keep it nested since there is going to be multiple modals, one for each “dog”
Public Link: http://waggo.webflow.io/pet-trainer
In this link you need to access the “Pet Trainer” Page: https://preview.webflow.com/preview/waggo?preview=8fe2aac9c5150d7f77c76c7983c6ca37
Thank you for your help
I am taking a look right now. But have you thought about doing this using the new interactions rather than legacy?
Using the new interactions works perfectly when I recreate what you are trying to do.
@PHRyan I may be wrong, but when I tried using the new interactions I found difficult to duplicate the same interaction for multiple objects. In the old interactions all I have to do is click nested elements.
I need to create the same pop-up for 8 elements in the same page. Is there a way to make it easy?
Well, I believe the way you have it set up you could just leave it how it is. Keep the Legacy interactions the same but just make the pop-up close button on the new interactions. Target the “modal-wrap” and then change “Affect” to “All elements with this class” instead of “Selected Element”. That way, any instance of the pop-up would close no matter what.
Here is a screenshot of what I mean:
Thank you it worked perfectly. I wasnt aware of the Target “All elements with this class” option!
Glad I could help! And that version of “This Class” was just recently added a week or 2 ago. Very helpful haha