Docs

[kaizan]

Hi there,

I have added custom CSS to display the hamburger menu on desktop. I almost have it how I want it but I need your help with one more thing. I want the hamburger menu to appear after scrolling past the slider (on the homepage only).

Can you help?

Here is the CSS I am currently using:

.x-navbar {
  text-align: right;
}

.x-navbar .desktop {
    display: none !important;
}

.x-navbar .x-btn-navbar {
    display: inline-block;
    box-shadow: none;
    color: white !important;
    background-color: rgba(0,0,0,0) !important;
}
.x-nav-wrap.mobile.collapse.in {
  display: block;
}
.x-navbar .mobile .x-nav {
    background-color: rgb(107,188,255); /* Change to your preferred  background color for mobile menu*/
}

Thanks

[kaizan]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in! Usually this kind of customization is out of our support scope but as you have gone so far, it’s easy to assist you on this with your existing CSS. Let’s add this CSS as well:

.x-navbar .x-btn-navbar {
    opacity: 0;
}
.x-navbar.x-navbar-scrolled .x-btn-navbar {
    opacity: 1;
}

Hope this helps.

Cheers!

[Author]

Posts