This relates to a header set to sticky (not sticky on scroll), with a value set to ‘slide up’. The mobile menu is the normal one, not the nav nestable one.
After checking with both Safari and Chrome, the issue is as follows -
When the user scrolls down the page, the header slides up (hides). Now, when the scroll direction changes to scrolling up, the header slides back down (reappears), which is great. Here’s the problem - when toggling the mobile menu in this state, and then clicking on a link in this menu and navigating away from the current page, if the user navigates ‘back’ on the device, the mobile menu is gone, and the page is frozen, and must be reloaded.
This does not occur when the mobile menu is toggled from the top of the page, before it has been hidden by scrolling down. When the menu is toggled from the top of the page, the user navigates to a different page through the mobile menu, and then navigates back, the mobile menu remains active and if it’s closed, they’re back at the previous page. The issue occurs only when the menu has been hidden after scrolling down, and then when the sticky menu slides down (reappears), when the user scrolls up.
I have tested the Bricks Builder website too on Safari and Chrome and find the same issue regarding the sticky header and mobile menu.
The same exact issue seems to be occurring on the Bricks Builder website page also, as that too uses a sticky header that hides when scrolling down. I’m not using the feature so I would ask that you have a look at the Bricks website, as it’s behaving the same way as when I tried it.
I’ll try and explain it, it’s something that would be able to be tested on the actual Bricks Builder website using a mobile device.
It seems to be an issue with sticky headers set to hide when the user scrolls down (it then reappears when they scroll up). It seems fine on Desktop, only on mobile is it acting weird.
Example of working header/menu behaviour when it’s interacted with at the top of the page (before scrolling down and reappearing on scroll up):
Select hamburger toggle to open mobile menu
Select menu link to navigate to new page
When new page loads, navigate BACK to the previous page via the browser
When previous page loads, the mobile menu is still open, and is able to be closed and the page behaves normally
The issue appears when the user scrolls down, causing the header to be hidden, and then when it is interacted with after it reappears (user scrolls up), this is what happens -
User scrolls down from top of the page, hiding sticky header
Sticky header reappears on scroll up
Select hamburger toggle to open menu
Select menu item to load new page
When new page loads, navigate BACK to previous page using browser
When previous page loads, the mobile menu is not open as it was in the previous example, and the page is not scrollable, as if it’s frozen. Page must be reloaded.
Like I mentioned, this issue is occurring on the Bricks Builder website as well.