Как на js отслеживать сколько юзер проскролил вниз даже если body { overflow:hidden; }?

Question

[nonconformiste]

Казалось бы тривиальная задача, но я не настолько хорошо знаком с апи браузера что бы ее решить, у меня есть блок долистывая до которого у body { overflow:hidden; } становится, но мне нужно отследить дальнейший скрол что бы в нужный момент открепить body, это некий слайдер у меня. Вопрос, как?

Comments

[Aetae]

При overflow:hidden оно, вестимо, скроллится программно. Вот в ту часть программы что скроллит и внедряйся.

[nonconformiste]

Aetae, типо отслеживать скрол не окна а элемента на котором фокус?

[nonconformiste]

Aetae, если можете подробно опишите, я как понял ваш коментарий по своему попробовал и не вышло ничего из этого

[godsplan]

Мне кажется ты хочешь решить проблему которая решается с помощью height:200vh + position:sticky

[godsplan]

https://play.tailwindcss.com/uf3RQaXRU8

[nonconformiste]

godsplane, да, как раз додумался, просто в общей картинке верстки не хотелось создавать 200vh пустого пространства, но это оказалось не так уж и больно)

Answer 1

[B14DbIK4]

Попробуй это:

<div id="scroll-container">
    <div id="content">
      <!-- Контент -->
    </div>
  </div>

  <script>
    const scrollContainer = document.getElementById('scroll-container');

    scrollContainer.addEventListener('scroll', () => {
      const scrolledPixels = scrollContainer.scrollTop;
      console.log(`Проскролил вниз на: ${scrolledPixels} пикселей`);
    });
  </script>