title: Timeline change css on enter view port
body: <p>Am trying to change the background color of the timeline on scroll like on <a href="https://somaliastabilityke-public.sharepoint.com/apply" rel="nofollow" title="site">this site</a>.My replication of the sample is <a href="http://ssf.masterpiecefusion.com/apply/" rel="nofollow">development site</a>. Take a look at the <a href="http://codepen.io/GotaloveCode/pen/dMRNjq" rel="nofollow">codepen</a> I tried using. The closest I have come to replicating it is with the code below which makes the change in color on each timeline circle flicker on/off on scroll.</p>
  
  <pre><code>jQuery(document).ready(function($) {
  function onScroll() {
    $('.cd-timeline-block').each( function() {
      if( $(this).offset().top &lt;= $(window).scrollTop()+$(window).height()*0.05 &amp;&amp; $(this).find('.cd-timeline-img').hasClass('cd-inactive') ) {
        $(this).find('.cd-timeline-img').removeClass('cd-inactive').addClass('cd-active');
        $(this).find('.cd-date').addClass('cd-ssf-color');
      } else {
        $(this).find('.cd-timeline-img').addClass('cd-inactive').removeClass('cd-active');
        $(this).find('.cd-date').removeClass('cd-ssf-color');
      }
    });
  };
  
  $(window).scroll(onScroll);
  });
  </code></pre>