Different logo on scroll

  • Hello, can I have different logo on sticky menu bar? Bc I want different logos – dark on non sticky and light version on sticky.

    Thank you

Viewing 1 replies (of 1 total)

  • Hi @thetomas88,

    Thank you for reaching out to us.

    Try this CSS code:

    .sticky-active .site-branding > a {
        background-image: url('https://yourwpsite.com/path/to/your/logo.png');   
    }

    .sticky-active .site-branding > a {
        display: inline-block;
        width: 309px;
        height: 75px;
        backround-size: cover;
        background-repeat: no-repeat;
    }

    .sticky-active .site-branding > a img {
        opacity: 0;
    }

    Add it to your site’s Additional CSS, which is located under Appearance > Customize menu.

    Do not forget to supply your sticky logo image by replacing https://yourwpsite.com/path/to/your/logo.png in the code above with link to your image file, which is uploaded to your site’s Media Library (under Dashboard > Media).

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.