1. Home
  2. Knowledge Base
  3. Divi von Elegant Themes
  4. Header / Menü fixieren, Hintergrund + Schriftfarbe ändern

Header / Menü fixieren, Hintergrund + Schriftfarbe ändern

Einfügen folgenden Codes in einem Divi Modul Code

<script>
jQuery(document).ready(function(){
//Ändere die Zahl hinter dem Gleich um den Srollpunkt zu ändern
  var changePosition = 50;
//***********************************  
var aktPos = $(this).scrollTop().valueOf();
if (aktPos > changePosition) {
$(".scroll-header").addClass("scroll-fixed-header");
};  
$(window).scroll(function() {
var scroll = jQuery(window).scrollTop();
if (scroll > changePosition) {
$(".scroll-header").addClass("scroll-fixed-header");
}
else{
$(".scroll-header").removeClass("scroll-fixed-header");
}
});
});

</script>
<style>
  /*Ändere hier die Farbenummer hinter der Raute um die Farbe der Schrift VOR dem Scrollpunkt zu verändern*/
  .scroll-header ul.et-menu a  {
		color: #ffffff !important;
  }
  
/*Ändere hier die Farbenummer hinter der Raute um die Farbe der Schrift NACH dem Scrollpunkt zu verändern*/
  .scroll-fixed-header ul.et-menu a  {
		color: #000000 !important;
  }
  
.scroll-header {
  /*Gebe hinter background: die Farbe oder transparent ein, welche du als erstes haben möchtest*/
	background: transparent;
  /*********************************/
	-webkit-transition: background-color 1s ease-out;
	-moz-transition: background-color 1s ease-out;
	-o-transition: background-color 1s ease-out;
	transition: background-color 1s ease-out;
}
  
  

.scroll-fixed-header {
    /*Gebe hinter background: die Farbe oder transparent ein, welche du ab dem Scrollpunkt haben möchtest*/
	background: #FFFFFF !important;
    /*********************************/
	-webkit-transition: background-color 1s ease-out;
	-moz-transition: background-color 1s ease-out;
	-o-transition: background-color 1s ease-out;
	transition: background-color 1s ease-out;
}
  
.et_pb_menu__menu {
    margin-right: 20px !important;
}
</style>
Was this article helpful?

Related Articles

Need Support?

Can't find the answer you're looking for?
Contact Support