Start a javascript function only on a particular section

Issue

I'm making a one page website which has two sections. I've added typewriter effect(something like this- codepen.io/danielgroen/pen/VeRPOq ) to the second section of the website. However, this effect starts once the page is loaded. How to start the effect only when I scroll to the second section?

<section>
 <div> 
   <p> hi how are you? </p>
 </div>
</section>
<section>
<h1> Hallo, Wij zijn Occhio! </h1>
</section>

Solution

You can run your effect when you scroll the window and when you reach the second section

$(window).scroll(function() { 

      if ($(window).scrollTop() >  $("section:nth-of-type(2)").offset().top) {
             // run your effect here
      }

});

Answered By - Chiller