Change to a different logo when you scroll down.
The media query for mobile is only needed in some cases if the default logo isn’t visible due to the logo swap.
Sources:
- https://www.elegantthemes.com/blog/divi-resources/switching-your-logo-on-a-fixed-header-in-divi
- https://quiroz.co/change-the-logo-when-scrolling-down/ (with child theme)
/* -- START Switch logo on fixed menu -- */
.et-fixed-header #logo {
content: url(https://abri.hrcws.nl/wp-content/uploads/Abri-Reclame-500x48-logo-zwart.png);
}
@media only screen and (max-width: 980px) {
#logo {
content: url(https://abri.hrcws.nl/wp-content/uploads/Abri-Reclame-500x48-logo-zwart.png);
}
}
/* -- END Switch logo on fixed menu -- */
Code language: CSS (css)