Docs

[armintz]

trying to make my top bar sticky/static with my static nav menu.

closest i’ve gotten is with this code in my custom css:

.x-topbar {
position: fixed;
width: 100%;
}

.x-navbar {
padding-top: 46px;
}

with this code above, the topbar / nav menu are perfectly aligned/static when you scroll down, which is great.. but before you scroll, my logo’s top padding seems be absorbed into the topbar, and the height of the navmenu seems to be double in size and pushing down onto the element area below it.

any idea how to fix?

let me know if screenshots will better help illustrate the issue.

[armintz]

This reply has been marked as private.

[Paul R]

Hi,

Please replace your css code with this

/* STICKY TOP BAR */
.x-topbar {
     top:0;
     position: fixed;
     width: 100%;
}

.admin-bar .x-topbar  {
     top:32px;
}

.x-logobar {
    width:100%;
    top: 46px;
    position: absolute;
}

.admin-bar .x-logobar {
    top: 78px;
}

.x-navbar {
     position:absolute;
     top:194px;
     width:100%;
}

.x-navbar.x-navbar-fixed-top {  
    top:46px;
     position:fixed !important;
}

Then add this in custom > Edit Global Javascript

jQuery(function($) {
    $(window).scroll(function(){
        if($(window).scrollTop() == 0){
            
            $('.x-navbar').removeClass('x-navbar-fixed-top');
        }
    })
});

Hope that helps

[armintz]

thanks for the reply. unfortunately this didn’t fix it.

[Jade]

Hi there,

Please update this code:

.x-navbar.x-navbar-fixed-top {
    top: 46px;
    position: fixed !important;
}

to

.x-navbar.x-navbar-fixed-top {
    top: 78px;
    position: fixed !important;
}

Hope this helps.

[armintz]

Same issue. It’s covering up almost an entire cornerstone block (below the nav menu) and jumping erratically on scroll.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> CSS :

@media (min-width:979px){
body.x-navbar-fixed-top-active .x-navbar-wrap {
    min-height: 269px;
}
}

Hope it helps.

[armintz]

This reply has been marked as private.

[Rue Nel]

Hello There,

We certainly appreciate the feedback! This is something we can add to our list of feature requests. This way it can be taken into consideration for future development. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive.

Thanks!

[Author]

Posts