Change Altitude Pro Themes Header Colors On Scroll

By default, the background color for the Altitude Pro themes site header is transparent on the front page and black on all other pages. The CSS in this tutorial enables you to change, on scroll:

  • The background color for the site header
  • The color of the nav menu links
  • The color of the site title text

site-header

All you need to do is paste the following CSS at the end of the Altitude Pro child themes style.css file:

.site-header.dark { 
    background-color: #fff;
}

.site-header.dark .genesis-nav-menu a {
    color: #333;
}
        
.site-header.dark .site-title a,
.site-header.dark .site-title a:hover {
    color: #333!important;
}

Don’t forget to clear all caching, especially if using Chrome.

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.