Добавить/удалить class спустя 200px скрола?

Question

[Za Za]

var oldScrollY = 0;
var div = document.querySelector('.site-header');

window.onscroll = function() {
  var scrolled = window.pageYOffset || document.documentElement.scrollTop;
  var dY = scrolled - oldScrollY;
  
  if ( dY > 0 ){
    div.className = 'site-header site-header-top';
  } else {
    div.className = 'site-header site-header-bottom';
  }
  
  oldScrollY = scrolled;
}

Данный код добавляет класс сразу при скроле, тем самым ломая верстку. Как сделать чтоб он начал свою работу (добавлял/удалял на протяжении всей страницы, но спустя 200 верних пикселей?

Answer 1

[ThunderCat]

Вешать событие на онскролл - плохая привычка и устаревшая практика. Для этого сегодня есть интерсекшн обсервер.