title: jQuery: How to auto scroll between sections using scroll as trigger
body: <p>I'm trying something where users can navigate sections of a webpage without a nav bar. There are 4 sections to the page, and each section is a full screen in size (100vh). Each time the user scrolls down I want it to have an animated auto scroll to the next section. </p>
  
  <p>What jQuery/javascript can I add to make this work? </p>
  
  <p>html: </p>
  
  <pre><code>&lt;section&gt;&lt;/section&gt;
  &lt;section&gt;&lt;/section&gt;
  &lt;section&gt;&lt;/section&gt;
  &lt;section&gt;&lt;/section&gt;
  </code></pre>
  
  <p>css: </p>
  
  <pre><code>section {
      background-color: #20c080;
      height: 100vh;
      width: 100vw;
  }
  </code></pre>
  
  <p>UPDATE:
  jQuery:</p>
  
  <pre><code>$(window).scroll(function() {
  var scroll = $(this).scrollTop();
  console.log(scroll);
  if (scroll &gt; 100 &amp;&amp; scroll &lt; 200) {
          $('html, body').animate({ scrollTop: $('#about').offset().top }, 'slow');
          return false;
  }
  else if ( scroll &gt; 950 &amp;&amp; scroll &lt; 1050) {
          $('html, body').animate({ scrollTop: $('#work').offset().top }, 'slow');
          return false;
  }
  });
  </code></pre>