Maak een sticky header in Divi

Een sticky header is handig als je wilt dat je gebruiker door kan klikken naar een andere pagina, waar hij zich ook bevindt op je website.

Om een sticky header te maken, ga je naar de section-opties >> klik op geavanceerd en tik de volgende CSS ID “myHeader”

Vervolgens zet je volgende code in je javascript.


//make sticky header
window.onscroll = function() {myFunction()};

var header = document.getElementById("myHeader");
var sticky = header.offsetTop;

function myFunction() {
if (window.pageYOffset > sticky) {
header.classList.add("sticky");
} else {
header.classList.remove("sticky");
}
}
//end make sticky header


en in je css plaats je de volgende

.sticky {
position: fixed;
top: 0;
width: 100%;
}