DEV Community

Discussion on: Show and hide a header based on scroll direction

Collapse
 
lexlohr profile image
Alex Lohr

One tiny optimization: classList.toggle has a little known optional second boolean argument which overrides the class being (in)active. So

if (windowY < lastScroll) {
  header.classList.add('scroll-up');
} else {
  header.classList.remove('scroll-up');
}
Enter fullscreen mode Exit fullscreen mode

becomes

header.classList.toggle('scroll-up', windowY < lastScroll);
Enter fullscreen mode Exit fullscreen mode
Collapse
 
dailydevtips1 profile image
Chris Bongers

Oh nice actually never used that one, time to look into that
Thanks Alex 💖