My homepage starts with a header (position: absolute) and a full-width slider.
I want the header to appear (position: fixed) when the user is scrolling towards the top of the page and moving back to absolute again when the scroll reaches the slider.
I have looked into at least 15 different StackOverflow and other websites similar question but I can't find a solution. Can someone help please?
function stickyHeader() {
let scrollPoint = window.scrollY;
let sliderHeight = jQuery('.swiper-home').outerHeight();
jQuery(window).scroll(function (){
if (scrollPoint > sliderHeight){
if(//scrolling towards top){
header.addClass("fixed-header");
} else {
header.removeClass("fixed-header");
}
}
})
}
window.addEventListener('scroll', stickyHeader);