Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • October 30, 2018 at 4:14 pm #1028115
    nancy2434

    I am using transparent headers throughout the site. When I scroll and the menu shrinks, the hamburger and search icon “disappear” because they are white, and the bg changes to white.

    Can you help me to change the hamburger and menu to black when user scrolls down?

    October 30, 2018 at 11:06 pm #1028259
    Jordan Shannon

    Hey Nancy,

    Add this to quick css:

    #top .sticky_placeholder{
top:51px!important;
}

    Best regards,
    Jordan Shannon

    October 31, 2018 at 2:58 am #1028338
    nancy2434

    I do not think that the CSS you suggested has fixed the problem. I am looking for some CSS that will detect that the header has been scrolled (and changed from transparent to white) and change the color (and hover) states of the hamburger icon and search icon from white to black so they show up.

    October 31, 2018 at 7:06 pm #1028579
    Jordan Shannon

    Hi,

    Apologies, it seems my answer to another question landed on yours. Please try the following instead:

    .header-scrolled-full #menu-item-search a{
color:#000!important;
}

.header-scrolled-full.header_color .av-hamburger-inner, .header-scrolled-full.header_color .av-hamburger-inner::before, .header-scrolled-full.header_color .av-hamburger-inner::after{
background-color:#000!important;
}

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.