• Hello,

    So I’ve just finished setting up my sticky navigation. All is working!

    However, I would like for the navigation links to change colour to white, so that it is clear with the transparent header. Please see attached image – https://postimg.cc/0KPWMt0s

    So as the transparent nav background comes in, I would like the navigation menu colour to change from the purple to the white.

    Here is my coding that I have implemented to the navigation menu. The effect offset is also set to 100px

    selector.elementor-sticky--effects{
    background-color: rgba(0,0,0,0.4)!important;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    }
    selector{
    transition: background-color 1s ease !important;
    }
    selector.elementor-sticky--effects >.elementor-container{
    min-height: 70px;
    }
    selector > .elementor-container{
    transition: min-height 1s ease !important;
    } .logo img {
    max-width: 140px;
    height: auto;
    transition: all 1s ease;
    }
    .elementor-sticky--effects .logo img {
    max-width: 120px;
    height: auto;
    }
    • This topic was modified 1 year, 5 months ago by bkemal.

    The page I need help with: [log in to see the link]

  • The topic ‘Sticky Nav menu change colour with scroll’ is closed to new replies.