Docs

[joshnwarren]

Currently Im using this CSS

.x-navbar {
   background-color: transparent !important;
}

body.x-navbar-fixed-top-active .x-navbar-wrap { height:0px!important;}

/* Transparent Navbar on Scrolling - CSS */

.masthead .x-navbar {
   background: white;
   -webkit-transition: 0.3s all ease-in-out;
   -o-transition: 0.3s all ease-in-out;
   transition: 0.3s all ease-in-out;
}

.masthead.mi-fixed-top .x-navbar.x-navbar-fixed-top {
   background: white !important;
}

.x-navbar .desktop .x-nav > li > a, .x-navbar .desktop .sub-menu li > a, .x-navbar .mobile .x-nav li a {
    color: hsl(100%, 100%, 100%);
}

.home p:empty {display: none;}

.page-template-template-blank-4-php .x-slider-container.below {
    border-bottom: 1px solid rgba(0, 0, 0, 0.97);
}

.x-brand {
    margin-top: 22px;
    font-family: "Lato",sans-serif;
    font-size: 42px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.035em;
    color: hsla(0, 30%, 17%, 0);
}

AND this javascript

/* Transparent Navbar on Scrolling - jQuery */
jQuery(document).ready(function($) {
   $(window).scroll(function(){
      if ($(this).scrollTop() > 100) {
         $('.masthead.masthead-inline').addClass('mi-fixed-top');
      } else {
         $('.masthead.masthead-inline').removeClass('mi-fixed-top');
      }
   });
});

to make my header bar go from transparent to solid white but since my text is also white it becomes unreadable. Is it possible to also change the color of the text from white to black?

Also one other question, can you add a shadow under the header once it turns white?

[Jade]

HI there,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[Author]

Posts