Hamburger menu that changes to nave bar on scrolling

#1

Hi all. I would like to emulate the navigation style on BWDs Joey overview page: https://www.bigwhiteduck.com/stacks/joey/

To summarise, the menu starts with a hamburger menu button which allows focus to be on the top banner. However as you scroll down a sticky nav bar appears.

Thanks

#2

The BWD menu itself is made using the forthcoming MenuLab stacks but the scroll appearance of the main menu is simply done with Chroma Pro.

Basically, it is a Chroma with a menu and a hamburger in it. The menu is set to be hidden until the first chroma marker is encountered. It could be replicated in many ways but the main menu could be a Foundation TopBar, a Foundry Nav Bar, a MagicGellan2 or one of the other menu bar stacks available. The burger menu component could be done with a PopDrop Menu, a Limelight Menu or any other burger / overlay menu that is capable of being set to static position (this is important as it must be Chroma that does the fixed position).

3 Likes
#3

Great thanks - I’ll take a look