Mobile smooth scroll prevents native browser navigation from collapsing

[SkylerStearns]

Hello 👋

Describe the bug If smooth is set to false on a mobile/tablet device, and a user scrolls up/down, the browser's native url bar, or nav buttons will collapse to allow the more full screen view. If smooth is set to true on a mobile/tablet device, and a user scrolls up/down, the native browser elements will not collapse or expand. The page is stuck with the smallest possible viewable area at all times.

To Reproduce Steps to reproduce the behavior:

1. Go to any page that uses locomotive scroll, with mobile smooth set to true on Chrome. (Safari also, other browsers not checked.)
2. Look at the top URL bar.
3. Scroll down.
4. Look at the top URL bar.

Expected behavior The URL bar (and lower nav bar) should collapse, and expand when a user scrolls down and up respectively.

Screenshots Screenshot 1: Expanded URL bar

Screenshot 2: Collapsed URL bar

Desktop (please complete the following information):

• OS: N/A
• Browser N/A
• Version N/A

Smartphone (please complete the following information):

• Device: iPhone XR
• OS: iOS14.4
• Browser: Chrome
• Version: 87.0.4280.77

Thank you 👊

[agyrafa]

Hey, @SkylerStearns .

Were you able to fix this?

[SkylerStearns]

@agyrafa Not really. I believe this is an issue with the way that Locoscroll works. Since they are translating the content up/down based on your scrolling, the actual position of the page doesn't change, but the content moves up and down with the animations. The alternative is that the animations are turned off, and the scroll position moves as expected. I'm not by any means an expert on this, and I haven't looked into this issue in a long time, but this is what I found from what I remember.