WordPress Theme help setting a fixed header + menu

3 Views

I’m trying to get the header and menu below it to be fixed/sticky and always be visible but can figure out how to do both.

http://goo.gl/rBxqUm

Post Views: 3

Related posts

Leave a Reply

1 comment

  1. This jQuery can be implemented in the theme. You adjust the number to however far down the page you want to scroll before the navigation appears. Then you style the fixed-nav class in the CSS to override the navigation’s styles and make it fixed to the top of the page.

    jQuery:

    jQuery("document").ready(function($){
    var nav = $('.cap-primary-menu');

    $(window).scroll(function () {
        if ($(this).scrollTop() > 136) {
            nav.addClass("fixed-nav");
        } else {
            nav.removeClass("fixed-nav");
        }
    });
});

    CSS:

    .cap-primary-menu.fixed-nav { z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; }

    Source:
    http://www.sutanaryan.com/how-to-create-fixed-menu-when-scrolling-page-with-css-and-jquery/