title: Trigger external javascript on a specific section
body: <p>I would like to implement this horizontal scroll script on my page : <a href="https://github.com/Corentinfardeau/horizontal-scroll" rel="nofollow noreferrer">https://github.com/Corentinfardeau/horizontal-scroll</a></p>
  
  <p>My js code looks like this :</p>
  
  <pre><code>var blocks = document.getElementsByClassName('block');
  var container = document.getElementsByClassName('containerv2');
  var hs = new HorizontalScroll.default({
      blocks : blocks,
      container: container,
      isAnimated: true,
      spring: 0.06
  });
  </code></pre>
  
  <p>It works fine, but the problem is that the animation begins when I'm on the top of the page. How can I trigger it ONLY when I'm on a specific section of my page?</p>
  
  <p>To be clear, let's say my page looks like this :</p>
  
  <pre><code>&lt;div class="hero"&gt; XXXXXXX (lot of texts, maybe 200vh)&lt;/div&gt;
  &lt;div class="container"&gt; some images &lt;/div&gt;
  &lt;div class="othersection"&gt; XXXXXX (lot of texts, maybe 200vh) &lt;/div&gt;
  </code></pre>
  
  <p>Here is an example : <a href="https://codepen.io/MannayStudios/pen/QVPpRb" rel="nofollow noreferrer">https://codepen.io/MannayStudios/pen/QVPpRb</a></p>
  
  <p>I'd like the script to trigger ONLY when I reach the container section of the page, and stop when I exit it.</p>
  
  <p>Thanks a lot for your answers :)</p>