How To Change Mega Menu Backlight Color Effect On Scroll - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

How To Change Mega Menu Backlight Color Effect On Scroll

G

gianlu

Template 3 years ago

Hello , on template opus i need know how to change backlight color effect that change on scroll.. i need if is possible to leave locked in the way wide like before scroll even after scroll leaving all same I enclose screenshot like i want to stay locked. need even to put text white. Thanks

https://www.screencast.com/t/1zv4f2dc7nO

0
11 Answers
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #74415

Hello gianlu

Please use this CSS to Template Options -> Custom Code -> Custom CSS

#sp-header.header-sticky{
    padding: 40px 0px;
}
#sp-header.header-sticky:before {
    background-image: linear-gradient(90deg, #aea6ff 0%, #6973fd 100%);
    transition: 0.3s;
    opacity: 1;
}

Best regards

0
G
gianlu
Accepted Answer
3 years ago #74442

Thanks! If i want tu put deep blue instead of current backlight mega menu color like screenshot: https://prnt.sc/2t3SbwBbj3jx it's enough change hex color in your custom css? which is hex code of this color? thanks

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #74561

Yes, just change the color code in the CSS. The color code is #27285D But what change do you need? If you use the below CSS, then you will get the dark blue color both in sticky header and normal header.

#sp-header {
    background: #27285D;
}
#sp-header:before, #sp-header.header-sticky:before{
    opacity: 0;
}
0
G
gianlu
Accepted Answer
3 years ago #74590

Hello, the header is fine now in this color. Last thing to do as you see it is to put menu items in white instead of in black as they currently are. How do you change? Thank you

https://prnt.sc/1F53A5piURm3

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #74597

Please use this CSS to Template Options -> Custom Code -> Custom CSS

.sp-megamenu-parent>li>a{
    color: #fff;
}
0
G
gianlu
Accepted Answer
3 years ago #74619

one last thing. I saw that from mobile the mobile menu symbol as in screenshot is black and I can't change it. is it possible to put this white too? thanks https://prnt.sc/GUD09weuvktF

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #74760

Please use this CSS to Template Options -> Custom Code -> Custom CSS

#offcanvas-toggler>.fa{
    color: #fff;
}
0
G
gianlu
Accepted Answer
3 years ago #74778

it still does the problem. If you look at the scrolling part of the page, it overlaps the menu from behind. also not where can I change the background of the section where the title is? Indicated with the arrow https://www.screencast.com/t/AEpmGyw2p https://prnt.sc/vOjWmCNC5Hym

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #75003

Which site are you refering to? I can see blue header.

0
G
gianlu
Accepted Answer
3 years ago #75010

Don't worry for This problem. Will manage it after. please now support your colleague to solve problem discussion https://www.joomshaper.com/forum/question/15505#qa-answer-74783. It has been open for a few days and is urgent. Thank you

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #75595

I hope that it is solved. I could not find the post.

0