Pop-up works in designer. not in web

I’ve got a pretty simple animated pop-up that displays a form with about 50 checkboxes. Click on a button and the pop-up appears. When I publish the page it doesn’t work. Not sure what’s going on at all.


Chrome dev tools shows a warning but no errors. I cleared the cache


Here is my site Read-Only: LINK
https://preview.webflow.com/preview/davids-cool-project-9b22c7?utm_medium=preview_link&utm_source=designer&utm_content=davids-cool-project-9b22c7&preview=454984bc0992fefc4eb788f0bcda7382&pageId=619e936184f97ca3728c9492&workflow=preview

Hi @David_Richardson

When I clicked the first button “image filters”, it works. But I can’t see the published site. Is that where the problem is?

#Gary Michael thanks for taking a look.

Yes, it was on the website page where I encounter the problem. I have the popup in two pages. One is this page URL https://www.helps-austin.com/gallery-copy

I did finally get this working. There were some ID conflicts highlighted by warning (lower left on the designer panel). I also realize that the pop-up needed “fixed positioning” to show up in the browser window (not way down at the bottom of the page)

So THOSE mysteries creating pop-ups solved.

Since I also had a problem with the appearance of the popup (opacity animation) I realized that the initial state of the pop-up must be hidden in the document. Second the initial state of the pop-up needs to have opacity of 0% AND be hidden. And third, BEFORE the pop-up animates to 100% opacity, the visibility must be set to “show”. The sequencing of the animations is important.

Okay that’s good. Glad you got it working. Take care.