Hello, I’m trying to create an interaction that takes the navbar from the top of the website to the bottom of the website.
The navbar has a height of 10vh and the interaction is just moving it 90vh to the bottom (following the math I should see exactly the entire navbar at the bottom doing this).
The problem is that it works perfectly on desktop but on mobile it doesn’t. I did a quick research and figured out that the problem is related to the top/bottom bars from the mobile browsers. So I just inserted the custom code from this thread:
And even doing this, it’s not working on mobile. The navbar still going off the viewport.
To check this on my read-only link you just need to tap ‘Click here’.
You need to try it on your cellphone to experience this error, since simulating a mobile device on your desktop browser, mysteriously works.
Real-example of what I’m trying to achieve:
https://showcase.commercialclassics.com/ (click on ‘About’ link at the top and you will see the interaction)
Thanks.
Here is my site Read-Only: LINK
(how to share your site Read-Only link)