Mega Menu Additional Modifications - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Mega Menu Additional Modifications

DB

Douglas B

Helix Framework 3 years ago

Hello, i hope you all are doing great. :) I guess this might be a helix ultimate question, as mega menu is controlled there.

My question is how can i change the functionality of the menu from "menu background bar appearing when scrolling down" to "menu background bar always visible" ?

I am currently using the template Luxyort, which has the top menu background bar only become visible when you scroll down the page.

If you look at the template Rythm, the top menu background bar is always visible. I would like to replicate this with the Luxyort template please.

I cannot find any of these types of settings anywhere in helix ultimate which is with the Luxyort template. Thank you for your help, and I hope you have a great day today.

0
5 Answers
DB
Douglas B
Accepted Answer
3 years ago #91309

Good Morning Pavel,

Thank you very much, that has worked like a charm. :)

@Pavel's custom CSS:

#sp-header {
    background-color: #000;
}
#sp-header.header-sticky {
    background-color: #f00;
}

I hope you have a great day today. Thank you again.

0
Pavel
Pavel
Accepted Answer
3 years ago #90946

Hi. Look at the preset settings or use css

#sp-header {
    background-color: #000;
}
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #90993

Hi Douglas,

You can follow Pavel's instructions. And thanks Pavel for sharing the solution with us.

-Regards.

0
DB
Douglas B
Accepted Answer
3 years ago #91097

Hello, Thank you very much for your responses. @Pavel, I had initially tried to change the header background color in the preset. With the Luxort template there seems to be only one preset to choose from. Black. Here is a screenshot from mine.

You can see leftside of the screenshot i have changed the header background color to pink for testing, but it does not change anything about the header background color (neither pre or post scrolling). On the righthand side of the screenshot i have used your custom code, and it changes the initial header background color (before scrolling) to white, perfect, it changes. But once you start scrolling, the header background color is blue. Where is it getting this value from?

0
Pavel
Pavel
Accepted Answer
3 years ago #91130

Hi Douglas.

Here is header background after scrolling start

#sp-header.header-sticky {
    background-color: #f00;
}
0