How do I make the navigation menu sticky?

Site URL: https://www.aeneis-paris.com

Hi,

I need help in making my navigation bar / menu fixed when scrolling.

I tried to add the code below but didn't work.

The categories in silk scarves are sticky when scrollling but with transparent background, ideally they should be fixed as the header with white background.

Can someone help me out?

Thank you

Lisa

Add this to Design > Custom CSS

/* sticky header */
header.Header.Header--top {
    position: sticky;
    position: -webkit-sticky;
    top: 45px;
    z-index: 9999;
}

Thank you, it worked perfectly for the navigation bar.

The only problem is that now the categories in SILK SCARVES  disappear when scrolling. 

How can I fix this?

You want this sticky?

Yes, but only when the user click on silk scarves.

Once they appear in this shop I would like them to be sticky, then when the user moves on to another shop, Bags for example, this two categories will disappear.

Thank you

On 9/22/2022 at 9:54 PM, LisaLubrini said:

Yes, but only when the user click on silk scarves.

Once they appear in this shop I would like them to be sticky, then when the user moves on to another shop, Bags for example, this two categories will disappear.

Thank you

 

It means, it will sticky on this page only?

https://www.aeneis-paris.com/aeneis-shop-silk-scarves