Responsive issues with popup

Design help Animations & Interactions
1

Hey guys :wave:

I came across a weird bug on my site when I go into tablet view or smaller – inside the hamburger menu you will see a get started button that populates a popup form.

That form works fine on desktop – but inside of mobile when you can click the “Get Started” button it will close the menu but nothing pops up. When you try to open the menu again then the form finally pops up.

If you continue to press the menu button the form will pop in and out. The only way to close the popup is by clicking the “X” button.

Anyone know a solution.

  • will buy you a coffee for the solution

All the best,
Doug

Here is my public share link:
https://preview.webflow.com/preview/crossfitconquest?utm_medium=preview_link&utm_source=dashboard&utm_content=crossfitconquest&preview=0da4f0f0c869895245706eeffcc836c3&mode=preview

2

Hello.
Your link gives a 404 error.

3

I have updated the link!

4

Actually, there is one simple move you can do here:

On the desktop view, open the navigator and drag the entire element and contents of quote_form 2 completely outside the navigator, like this:

Screen Recording 2020-04-28 at 08.48 pm
Screen Recording 2020-04-28 at 08.48 pm1671×908 1.8 MB

The reason for this is because the contents of the popup are children of the mobile nav menu, so when that closes, everything inside it goes away too (the popup).

Moving the popup outside of that should work perfectly. :tada:

tenor (19)

Any questions please let me know. That’s a great looking site! :smile:

Happy designing!
:webflow_heart:

2 Likes
5

Wow, thank you so much!

Such a simple fix that I would have never thought of.

Thank you for your help

1 Like