Hi how can make, with Helix ultimate v2 https://www.joomshaper.com/joomla-templates/helixultimate ,
when visitor is on top of the page main menu is transparent and when start to scroll it is become no-transparent, something like this template have https://www.joomshaper.com/joomla-templates/luxyort
Thank you
Solved
Templates
Sticky menu transparent
Accepted answer
Marked as the solution
Ofi Khan Staff
Okay, I got you now. Please use this CSS to Template Options -> Custom Code -> Custom CSS
header#sp-header {
position: absolute;
background: transparent;
box-shadow: initial;
width: 100%;
}
#sp-header.header-sticky{
background: #fff;
}7 more replies
Ofi Khan Staff
Hello komir
Please use this CSS to Template Options -> Custom Code -> Custom CSS
#sp-header.header-sticky{
background: transparent;
}
Best regards
komir Asked this
Thanky ou but with that code menu become transparent when user start to scroll and when is on top of the page it is not transparent.
Need it reverse, when vistor is on the top of the page menu is transparent and when start to scroll menu become no-trasparent.
Thank you
Joomla! Man
Try add
#sp-header {
background: transparent;
position: absolute;
}Thanks
komir Asked this
Thank you
I have add but no luck, still it is transparent when is on top
http://irtap.radna.us/
Pavel
#sp-header {
background: rgba(255, 255, 255, 0);
position: absolute;
box-shadow: none;
}
#sp-header.header-sticky {
background: rgba(255, 255, 255, 1);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1);
}
komir Asked this
Solved
#sp-header.header-sticky {
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
animation: spFadeInDown 0.5s;
background: whitesmoke;
}
#sp-header {
background: transparent;
position: absolute;
}
Joomla! Man
remove
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
animation: spFadeInDown 0.5s;Select
Thanks
Log in to reply.