Как добавить header когда страница скролится вверх?

Question

[TipTop89]

Как сделать так что-бы когда скроллим страницу хедер пропадает. Но если он проскролить вверх , хедер снова появляется на любом участке. Спасибо

Comments

[mahmudchon]

Скролим - пропадает. Скролим снизу вверх - появляется.
Но я не уверен, что Вам нужно имеено так, хоть и соответствует описанию, потому что position fixed, который я убрал, просто так в коде не появляется. Если вам нужно как-то иначе - опишите более понятно.

Answer 1

[Danny Arty]

Comments

[historydev]

Жалко поттер уже старый, можно было столько всего снять)

[Сергей delphinpro]

Можно просто смoтреть на deltaY у события wheel (может и у scroll есть).
Если положительное - показывать шапку, если отрицательное - скрывать (или наоборот, не помню).

const header = document.querySelector('header');

window.addEventListener('wheel', evt => {
  if (evt.deltaY < 0) {
      header.classList.remove('_header-scroll');
  }
  if (evt.deltaY > 0) {
      header.classList.add('_header-scroll');
  }
});