How to Make a Navigation Menu Static

Site URL: https://www.infinix.com/

Hello,

How can I make the navigation menu at the top of our website static (remains at the top) when someone scrolls down on the page?

Stephanie

On 3/11/2022 at 11:48 AM, saschulze said:

Site URL: https://www.infinix.com/

Hello,

How can I make the navigation menu at the top of our website static (remains at the top) when someone scrolls down on the page?

Stephanie

You mean make it sticky to top on scroll down?

Yes, so it stays at the top when scrolling. 

12 hours ago, SSchulze said:

Yes, so it stays at the top when scrolling. 

Hi. DO you use Personal or Business or Commerce Plan? each plan will need a different code to achieve this

We are on the Commerce Advanced monthly plan. 

Hi,

Use this code in Design -> Custom CSS

@media screen and (min-width:992px){
div#page-header {
    position: fixed;
    top: 28px;
    z-index: 999999;
    background: white;
    width: 100%;
}


.language {
    position: fixed;
    top: 0;
    background: white;
    z-index: 99999;
    width: 100%;
}

body>div[style="text-align: right;"] {
      position: fixed;
      top: 0;
      background: white;
      z-index: 99999;
      width: fit-content;
      right: 0;
}
}

Please use the like button if it helps you!

Best,
Leopold

Works great! Thank you!!!

I do have a few issues after adding this code so I backed it out.  For the pages such as the one below, after I add this code the picture below the menu does not move but also stays sticky at the top.  That really needs to scroll up under the menu too.  

https://www.infinix.com/en/infinix-products

Stephanie