Reply To: Hide nav & top menu, logo until scroll

[Tom]

Something like this might work:

<script>
jQuery( document ).ready( function( $ ) {
    var $document = $(document),
        $header = $('.site-header'),
        $main_nav = $('.main-navigation'),
        $secondary_nav = $('.secondary-navigation'),
        className = 'hasScrolled';

    $document.scroll(function() {
        $header.toggleClass(className, $document.scrollTop() >= 50);
        $main_nav.toggleClass(className, $document.scrollTop() >= 50);
        $secondary_nav.toggleClass(className, $document.scrollTop() >= 50);
    });
});
</script>

That can go in the wp_footer hook in GP Hooks.

Then add this CSS:

.site-header,
.main-navigation,
.secondary-navigation {
    display: none;
}

.site-header.hasScrolled,
.main-navigation.hasScrolled,
.secondary-navigation.hasScrolled {
    display: block;
}

Haven’t tested it, but it should work in theory 🙂