[Support request] Sticky nav "flashing" on scroll

[Marcus]

Hi, on my website I have a sticky nav which I have added some css to (see my other topics, I can’t seem to find a profile page to find my older topics sorry).

If you let the page fully load, then scroll down, you’ll see the nav “flashes” for a second despite the fact that the nav should only show when you scroll back up.

PS: I actually remember having this same issue about 4-5 years ago haha. I wish I could find my old topic to know how we fixed it.

[David]

Hi there,

any particular device or browser this happening on? Having trouble seeing the issue.

You can access your older topics via the Forum Profile button at the top of this page.

[Marcus]

https://recordit.co/u22GtLsiyp

See how the nav bar appears for a split second as I’m scrolling down? It should only appear when I’m scrolling back up.

I’m using Chrome.

—-

PS: these are the two nav related CSS snippets I’ve added:

#site-navigation:not(.navigation-stick) {
    visibility: hidden;
    height: 0;
    overflow: hidden;
}

#sticky-placeholder {
    display: none !important;
}

&

.main-navigation .main-nav ul li.nav-button a {
    background-color: #4dc28b;
    line-height: 48px !important;
}

[Leo]

Any chance you can disable your custom CSS and all other plugins except GP Premium to test first?

Thanks 🙂

[Marcus]

Done, it still does the same thing:

https://recordit.co/jW0NjpzXPS

PS: I left this code in because otherwise it wouldn’t show the stickynav as intended:

/* only sticky nav */

#site-navigation:not(.navigation-stick) {
    visibility: hidden;
    height: 0;
    overflow: hidden;
}

[Tom]

That code is likely the reason for this. What’s that custom CSS fixing, exactly?

Let me know 🙂

[Marcus]

It was suggested to me by support in this thread: https://generatepress.com/forums/topic/hide-sticky-nav-until-scroll/

It’s from your support docs here: https://docs.generatepress.com/article/show-sticky-navigation-only/

[Tom]

Ah, it seems that code is conflicting with how the sticky navigation only shows when scrolling up. As of right now there’s no way for us to know when the sticky navigation is visible when it’s set to only display when scrolling up – we’ll be addressing this in GPP 1.10.

[Marcus]

Alright thanks Tom, I’ll keep an eye out for that.

[Author]

Posts