title: How can I detect the scrollTop of an element using Vanilla Javascript?
body: <p>I want to add a class to an element when the user scrolls more than 100px from the top of the element but I seem to be triggering this as soon as the page loads. This is the code that I have at the moment</p>
  
  <pre><code>const content = document.getElementById("content");
  document.addEventListener("scroll", () =&gt; {
    content.classList.add(
      'curtain-in',
      content.scrollTop &gt; 100
    );
  });
  </code></pre>
  
  <p>Also with your answer can you please explain where I've gone wrong.
  Thank you in advance</p>