Navbar saved as symbol reacts different on another page

Design help Animations & Interactions
1

Hey Guys! First I’d like to wish anyone reading this a happy new year. So I have a navbar saved as a symbol that has a simple animation where if a user scrolls down the nav remains sticky but the opacity goes down to 0 and when they scroll up the opacity goes back to 100%.

What’s starnge is when I go to the about page, the nav only appears at the top of the page when scrolling back up but when you scroll downwards it works fine.

Any help towards fixing this will be really appreciated!
Thanks.

Here is my public share link: LINK
(how to access public share link)

2

Hi @raien,

Happy New Year to you too! :slight_smile:

I had a look and seems like the nav-bar works as you intended on the About page as well.

Thanks!

3

@RohanGanachari Thanks for getting back to me.

Actually if you scroll to half way on the page, the navbar wont be visible on the about page until you scroll all the way to the top. For the other pages whatever position you scroll down to, as soon as you scroll upwards the navbar will appear.