Mobile menu won't hide properly when tapping on modal

Design help General
#1

This is in reference to the TABLET view.

We have a modal-click-area (modal) div that shows up when the mobile menu icon is tapped…The problem we have is that when this modal-click-area is tapped, the mobile-open-menu div doesn’t go away. What we what is that when the modal div is tapped, the mobile-open-menu should move out of the screen the same way as when tapping the close icon.

We set the modal div as the trigger, but the mobile-open-menu div is like permanently stuck, despite animation set to have it move on the x-axis 100vw.

We don’t have this problem when we tap on the close button despite using the exact same animation.

Can someone help us please? Thanks!

Our read-only link is here

#2

Hello Skinpores,

I took a look into this issue and it is happening because of the animation, not the layout. Here is an image attached as to what you need to update:

Screen Shot 2020-11-27 at 8.53.22 AM
Screen Shot 2020-11-27 at 8.53.22 AM480×1510 55.6 KB

Right theree where it says only parents with this class you need to update it to all elements with this class. That is the reason why it’s working on X ( beecause it is a child of that element) but not on modal-click-area ( because they are siblings).

Webflow Experts at Flow Ninja Support Team!

1 Like
#3

Ahhh!!! We spent hours trying to solve it and never noticed! THANK YOU!!! :slight_smile: