title: Scroll Indicator on a specific element on a page
body: <p>I am trying to create a scroll indicator on specific content for a page something like this:</p>
  <p><a href="https://www.mrporter.com/en-se/journal/fashion/oliver-spencer-occasions-summer-wedding-1967062" rel="nofollow noreferrer">https://www.mrporter.com/en-se/journal/fashion/oliver-spencer-occasions-summer-wedding-1967062</a></p>
  <p>I have an element with ID <code>#js-content</code> to which I want to trigger the scroll content, but right now my code triggers on the whole page.</p>
  <p>How do I trigger it when the element shown on the viewport?</p>
  <p>This is my sample demo on codepen
  <a href="https://codepen.io/johndavemanuel/pen/YzZRapZ" rel="nofollow noreferrer">https://codepen.io/johndavemanuel/pen/YzZRapZ</a></p>