Archived topic
Two sticky menus?
5 replies · Started by Vera on April 3, 2020
I have two horizontal menus: secondary menu is at the top of my page followed by a header image and then my primary navigation below that.
I set my primary menu to stick to the top of the page when its normal position scrolls out of view. I would like the same to occur with the secondary menu. That is, I would like them to stack at the top of all my page with no header image between them.
Note that I have set a different header image for my home badge than the rest of my site but they all have the same arrangement for the two menus.
Can you help me with this?
Hi there,
We may be able to do this, but it depends on the setup. Any chance you can link us to your site?
It’s still in progress but here’s the home page:
Hi there,
try this CSS:
#secondary-navigation {
position: sticky;
position: -webkit-sticky;
top: 0;
}
.sticky-enabled .main-navigation.is_stuck {
top: 40px !important;
}Perfect! THANK YOU!!!
I don’t know why I didn’t think of CSS. I must’ve been stuck in the mindset that it was a GP feature, like for primary navigation.
Thanks again!
Glad to be of help
