How to close a custom menu over lay

[tommyboy82 (Tommy Stevenson)]

Hi Team

Struggling a bit with closing a custom navigation… I have it opening fine… I feel like it should be easy and i’m doing something quite obviously wrong, any help would be much appreciated

https://preview.webflow.com/preview/spring-4?utm_medium=preview_link&utm_source=designer&utm_content=spring-4&preview=57e7fc33a65c9ed877acbce8e27ad24d&pageId=5e301f13388bea729cf1f97b&mode=preview

https://spring-4.webflow.io/test

MAny thanks

---

Here is my public share link: LINK
(how to access public share link)

[kab653 (Mr Kabeer Hussain)]

Hi tommyboy82 I have took a screenshot of what the animation sequence should look like for the nav wrapper on the first and second click which worked for me.

Watch Video

[tommyboy82 (Tommy Stevenson)]

Hi @kab653

Thanks for taking the time to reply… I have copied you sequence I believe… but im still struggling with a the close of the nav div and also being able to action the the nav item again when re-clicking… this is my first real time trying to create with interactions so excuse my lack of knowhow

[kab653 (Mr Kabeer Hussain)]

Hi @tommyboy82

Can you provide me with some screenshots? So i can see where the issue is.

[tommyboy82 (Tommy Stevenson)]

Hi @kab653

I think i’m almost there, the nav doesn’t fade on first open but it is closing now

https://spring-4.webflow.io/test

Please find screen shots below

Thanks

[tommyboy82 (Tommy Stevenson)]

Screen recording… not great quality but you can see the difference between the fade and no fade at the start

https://recordit.co/yieDbkFJz1

[kab653 (Mr Kabeer Hussain)]

Copy this sequence on the nav open. This should solve your problem. It worked for me.

![image|690x388](upload://q4TWJcEwM6w7D7TUII02qzjEq8z.pngC

[tommyboy82 (Tommy Stevenson)]

@kab653

That appears to be working for me, thank you so much… so in theory I could replace the opacity with a move transition if I wanted… still getting my head around these interactions

[kab653 (Mr Kabeer Hussain)]

Hi @tommyboy82

If you wanted to you could replace the opacity with the move function. Here is a project I am working on at the moment you can take at look at how the nav bar works. In terms of search, opening and closing as well hiding and appearing on scroll.

https://kabeers-cool-project.webflow.io/

let me know what you think. Also if i solved your query can you please press the solution button thanks

[tommyboy82 (Tommy Stevenson)]

@kab653

https://kabeers-cool-project.webflow.io/

Thanks again for your help, I like your website too, would be a great one to dissect

thanks

[tommyboy82 (Tommy Stevenson)]

@kab653

Hi again… I have noticed that I can’t get this to work on mobile… as in it defaults to the native hamburger icon even tho I have disabled it for all devices?

Thanks

Tommy

[kab653 (Mr Kabeer Hussain)]

Hi @tommyboy82

The nav is showing the hamburger menu is set to tablet mode. Also opening and closing the menu on desktop isnt working anymore?
I see you made a few changes

[tommyboy82 (Tommy Stevenson)]

Hi @kab653

The menu is working fine for me on https://spring-4.webflow.io/test

[tommyboy82 (Tommy Stevenson)]

[kab653 (Mr Kabeer Hussain)]

Send me a preview link please

[tommyboy82 (Tommy Stevenson)]

Maybe the read only link is out of date?

here it is again https://preview.webflow.com/preview/spring-4?utm_medium=preview_link&utm_source=designer&utm_content=spring-4&preview=57e7fc33a65c9ed877acbce8e27ad24d&pageId=5e32f2d17e714c33b82d260c&mode=preview

[kab653 (Mr Kabeer Hussain)]

The menu on the mobile and table it is working fine for me?

[tommyboy82 (Tommy Stevenson)]

it works fine for me too in the designer… but when I view it on my mobile phone… I get the default hamburger… I tried private browsing thinking maybe it was a cache issue?!

[kab653 (Mr Kabeer Hussain)]

Yes must be a cache issue i have just tried it on my phone and it is working fine. I would suggest resetting your browser settings and clearing the cache hopefully this should resolve the issue. You could also try downloading a third party browser and try it on there but it is working fine on my phone.

[tommyboy82 (Tommy Stevenson)]

Smashing… thank you for your time again