Elementor Sticky Header on scroll up

JAVASCRIPT 26

1. Set sticky option to the header element
2. Add ID and Classes to the Header Container
3. Add Code to Elementor → Custom Code
<script>
var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementById("sticky-header").style.top = "0";
} else {
document.getElementById("sticky-header").style.top = "-80px"; /* adjust this value to the height of your header */
}
prevScrollpos = currentScrollPos;
}
</script>
<style>
/* Show Hide Sticky Header Speed Control */
#hide-header {
transition: all .4s ease!important;
}
</style>

Recent Pastes

Raw Paste