Streaming live at 10am (PST)

Hidden navigation bar reveal not working on mobile

I have a navigation bar that has no background, with a trigger on another hidden navigation (initially set to not display and -40px off top of screen - with a background colour) that once the page is scrolled beyond the header area displays the hidden one as block and animates it into view.
This works just fine on desktop both Safari and Chrome even when I resize the window down to iPad or iPhone width, but not on the actual iPhone or iPad…

The page is here, any help would be most welcome. Many thanks.

Hi @GourmetPixel, thanks reaching out. At the moment, interactions on scroll are disabled on mobile devices due to fact that those are using touch based events instead of scroll events (like is used on your interaction)… So I suggest you alter your design a bit starting at tablet portrait mode on down, to set the hidden menu that is used on desktop to Display None, and to use a normal drop down nav menu instead for the mobile views, and make it so your drop down menu is hidden at desktop view, and only displayed for tablet portrait view, down to phone portrait view.

Let us know if any questions.

Cheers, Dave

Oh that’s a shame, ok no worries I will just have a navigation with background showing all time then.


What about this workaround, did you try it?