Hi.
Have a sticky header and a full page color section. I wan’t to hide header-logo at enter and show it when user starts to scroll.
Have been trying this:
.logo{
display: none;
}
.header-scrolled .logo{
display: block;
}
But the logo do not appear when scrolling.
Thanks,
OPVAB
Hey opvab,
Could you post a link to the page in question so that we can take a closer look please?
Best regards,
Rikard
Yes, posted in PC.
//OPVAB
Hi,
Please try this code instead:
#top .av_header_transparency .logo {
display: none;
}
It will hide the logo if the menu is transparent. As soon as the user starts to scroll the logo will be displayed.
Best regards,
Dude
Worked like a charm, thanks
//OPVAB
Hi again.
But saw now an issue with the code. The logo disappears also from smartphones, and there would I like it to be visable.
Is it possible to control that with some @media only screen-code?
//OPVAB
Hi opvab,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (max-width: 767px) {
.responsive #top .av_header_transparency .logo {
display: block;
}
}
If you need further assistance please let us know.
Best regards,
Victoria
Two for two, great! All working as I want it to, thanks.
//OPVAB