▼
Streaming live at 10am (PST)

Menu doesn’t close correctly after scrolling to page section

Design help General
#1

Hi there :raising_hand_woman:t2:

I got a problem with my website. I already looked in some other forums but no post could fix the problem.

If I click on a menu item. The website scrolls to the correct section. After trying a lot of things I finally got the menu to close and show the hamburger icon again but still it doesn’t work properly. If I click on the hamburger icon after it scrolled to a section it just opens the menu again after clicking on the hamburger icon two times.

Can anyone please help me fix this? I really dispair on this…
Thanks in advance
Alex

Here is my site Read-Only: Webflow - Copy of Portfolio

#2

Can somebody please help me? I’m really desperate…

#3

Wrap your menu icon in a regular div, instead of the menu button div.
By clicking the menu button div, Webflow adds a seperate class which only gets removed, if you click another link (site reloads) or if you click the button again to close the menu.

On a onepage, you scroll to your section, and the class, which gets added, will not get removed until another click.
This is the reason you have to click twice.

Just replace the the menu button div with a regular div, asign your class again and this should be fixed.

Hope that helps.

#4

Hey Marius, thank you very much!

But I’m afraid that doesn’t work either…
If I do it the way you told me the close icon doesn’t change. It just stays the way it is when the menu is open.

#5

Hey Alexandra.

I tried it on your site by swapping the divs, made 2-3 interaction adjustments and it worked instantly.
However, the dropdown menu element is the wrong element you use here, because you don’t use any feature of it. It only make things more complicated as you can see.

Maybe you rebuild the entire element from scratch and I am sure, it will work the desired way.

#6

I did what you told me and rebuild the entire element from scratch.
Do you still now which interaction adjustments you made? It is working if I open the menu and close the menu directly. But if I click on a menu link I still have to click twice after the menu closes. I really don’t know what I need to do different.

#7

Is it possible that this happens because I gave the “menu icon” an interaction to close the menu on the second click? Because if I open the menu and directly click a menu link I didn’t clicked a second time on the icon, and this is what happens if I click on the icon after I chose a menu link.
Do you think that could be the problem? Do you have an idea how I could fix this?

#8

This is correct. I can’t see how you can achieve a proper solution with the 2-click interaction.
Kind of impossible, because your click won’t trigger a new class you could target.
Try a different approach.

If you need further help, I am confident you will achieve your goal with this thread: