If you’ve ever used the transparent header feature in Divi (or want the header to just not move on the page), it sometimes looks weird to have it scroll and drag over your content until it gets “fixed header” status and gets a background color.
This code will make it static on the page until it gets “fixed header” status and also stops it from animating.
Note: you might want to check the CSS @media min-width to make sure it works for your website.
@media (min-width: 981px) {
#main-header:not(.et-fixed-header), #top-header:not(.et-fixed-header) {
position: absolute; /* prevents the header from moving until it is fixed */
}
.et_fixed_nav #et-top-navigation, #top-menu a {
-webkit-transition: none!important;
-moz-transition: none!important;
transition: none!important; /* prevents the header from animating */
}
}
Jon Fullerhttps://freshysites.com/team/#Jon-FullerJon is from the Binghamton, NY area and graduated from the School of Art and Design at Alfred University with a Bachelor of Fine Arts. Concentrated studies were in Graphic Design and Video. Jon has an appreciation of all aspects of art and design, and has an extensive background in both print media and web — with a thorough understanding of video and photography. Jon comes to FreshySites with 9 years of graphic design and web experience. He continues to make a habit of researching new tools and technologies to broaden his knowledge in the web development industry. He’s a tech junkie who has a passion for implementing new techniques and improving his surroundings. Outside of work, Jon also enjoys going on new adventures with his wife, exercising, and sipping on quality craft beer.