Scrolling Sticky Nav doesn't display on refresh

Design help General
1

Hi Everyone.

I have a scrolling sticky nav that appears when you scroll. The issue is when the nav is visible and the page is refreshed it disappears.

Blue%20Bar
Blue%20Bar2874×934 258 KB

Page%20Refresh
Page%20Refresh2862×1058 228 KB

Here is my site Read-Only: https://preview.webflow.com/preview/new-communities-site?utm_medium=preview_link&utm_source=dashboard&utm_content=new-communities-site&preview=fd724fc1c6fbdb217e977f08c2a80b8c&mode=preview
(how to share your site Read-Only link)

2

Hi Christopher,

It will be easier to debug this with a link to the published project and knowing on which page the problem occurs.

That said,
On your community page load, there’s an interaction which has some errors:
Image%20001
which makes the interaction and the page load in a non complete way.

3

@avivtech I am sorry, you are correct the “Community Page” is the page the I am having the issue with the nav on refresh when scrolled.

I tried using an interaction on page load. Placing all elements into a div and have the div hide/show on load pushing the page to the top. This created an error with an interactive map embed (iframe) I am using. I had to abandon that solution, that is why the interaction was broken. I have removed the interaction completely now.

Is there another way to fix this issue?

Thank you in advance!

4

Your show/hide sub navbar interaction is:

  1. ‘Scroll into view’ interaction - which means that if you do not scroll into view the trigger element (Div Block 37) the animation will not trigger.
  2. The same interaction has an initial state for the sub navbar which will load once the page is reloaded by a chronological order. Last one is display:none.
    =
    All that leaves the display state of the sub navbar as none and do not trigger the animation.

This is my assumption. Since this is pretty hard to debug without a link to the published project… :frowning_face:

5

@avivtech here is a link to my share link:

https://preview.webflow.com/preview/new-communities-site?utm_medium=preview_link&utm_source=dashboard&utm_content=new-communities-site&preview=fd724fc1c6fbdb217e977f08c2a80b8c&mode=preview

and here is a link to the published page:

1 Like
6

Now that I’v seen the published project, I believe that my last replay is the solution :smile:
Try and LMK?

7

@avivtech I am sorry. I reread your solution a few times and do not quite understand how to fix.

8

Actually you’re right, I only identified the problem :sweat_smile:

I think that if you change the interaction to ‘while scrolling in view’, it will solve the problem.

9

That doesn’t seem to work. I cannot get the top blue bar to disappear when the page is scrolled to the top. See published page for example of functionality.