Sticky nav that appears after scrolling past hero disappears when page reloads

Hey everybody. Putting the finishing touches on my portfolio site and I’m having trouble with a few little details. Hoping you can help.

One in particular is I’ve got a fixed nav bar that appears after scrolling past the hero section in each of my case studies. However, I’ve found that if I reload the page and I’m already past the hero section, the fixed nav disappears and won’t come back until I scroll back up to where the hero section is in view.

Any suggested fixes?

If you want to take a look at the specific interactions, “Nav Scroll” is what I named the fixed nav hiding upon page load and “Nav Appear” is what triggers its appearance after scrolling past the hero section.

Guessing this is a minor tweak!


Here is my public share link: https://preview.webflow.com/preview/jason-marder?preview=f3d05bb2a99e8d37d4cab1b01e1c1632
(how to access public share link)

Hi @jasonmarder, ​there is not a built in option to force a page to reload at the top, but what you might try, is to use some custom code to try and force the page to the top on page reload:

​Try this code in the header of your site (note I have not tried this yet):

<script>
$(document).ready(function() {
    var url = window.location.href;
    if( url.indexOf('#') < 0 ) {
        window.location.replace(url + "#");
    } else {
        window.location.replace(url);
    }
});
</script>

I found this code at javascript - Force page scroll position to top at page refresh in HTML - Stack Overflow

​Here is how to use custom code: http://help.webflow.com/faq/how-to-add-custom-head-and-body-code-to-a-webflow-site

I hope this helps!

Dave!!! You’re a hero. Thanks for this solution worked like a charm! Thanks so much for your speedy help.

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.