Hi! I’ve followed Webflow’s tutorial on modals, and they seem to be working fine, but the thing is they only work once. If you close the modal and try to reopen, nothing happens. I see there’s already someone asking the same question in the tutorial’s questions, but there’s no movement over there. Maybe there’s a classes conflict? Can’t seem to figure it ot.
Also, they are not positioning correctly on mobile, the top gets chopped off.
The read-only link is not working.
Ups, i’ve updated it! Now it should work OK. Thanks!
Hi,
I couldn’t find any model to open (??) in your read-only link, maybe i just missed it?
In any case, you probably need to re-check your click triggers, maybe you missed a small detail, because usually when models open once but then don’t work again it’s because the triggers are not set correctly.
Remember, modals, or pop ups, need to be opened and closed, but when they close they need to be “reset” so that they work again when you try to open them again.
Cheers.
EDIT: Also, i compared your triggers to the ones i have on a project of mine, and i think you got your close animations backwards:
On close modal, you have the following → HIDE/SHOW (display:none) and then OPACITY (0)
What you should have → OPACITY (0) and then HIDE/SHOW (display:none)
EDIT 2: You can also have a trigger (on page load) that resets your modal, opacity (0) and hide/show (display:none) and set these attributes to “set as initial state”.
Thanks Kimmy! There was one modal not resetting, that was it. Thanks!