Okay
  Public Ticket #2179799
Transparent menu, Fixed top change background color on scroll
Open

Comments

  •  1
    vzhertnjgs78 started the conversation

    I am using the App Showcase demo on LandKit and have enabled these options: 

    Transparent menu ON
    Fixed top ON
    One page ON

    When I scroll down, the top menu background turns opaque white.  I want to change the menu background color to another opaque color other than white (lets say black, for example).

    When I attempt to add the following code to the CSS global section of the options, the menu background becomes black all of the time and stops being transparent, even before scrolling.

    .navbar-main {
    background-color: #000;
    }

    How do I change the menu background color to start out transparent and then change to a color of my choosing on scroll?

    Thanks!

  •  448
    Gabriel replied

    Hi, this is the correct code:

    header > .navbar {
        background: #000000;
    }
  •  1
    vzhertnjgs78 replied

    Thanks, that works!

    One other issue now:  Once you scroll, there is a small stripe of color along the full width of the bottom of the navbar.  See screenshot.  Happens in both Chrome / Safari, page zoom doesn't affect it.

    Attached files:  Screen Shot 2019-10-10 at 2.13.51 AM.png

  •  448
    Gabriel replied

    That's the header border, but can be easily removed. Update the code to this:

    header > .navbar {
        background: #000000;
        border-bottom: none;
    }
  •  1
    vzhertnjgs78 replied

    Great, thank you for all the help!