在用于激活动画事件的滚动条上，如何在向上滚动时不再播放动画

Question

在我的网站上，我有一系列动画全宽块将在滚动事件中激活，问题是如果用户决定向上滚动到上一个块，动画将再次播放，我该如何制作在第一次向下滚动事件期间播放动画时，每个块都会停留？谢谢！ 这是Fiddle，任何帮助将不胜感激！

var $animation_elements = $('.animatedelements');
var $window = $(window);

var cont = 0;
const MULTIPLIER = 300; //millis

function check_if_in_view() {
  var window_height = $window.height();
  var window_top_position = $window.scrollTop();
  var window_bottom_position = (window_top_position + window_height + 15);

  $.each($animation_elements, function() {
    var $element = $(this);
    var element_height = $element.outerHeight();
    var element_top_position = $element.offset().top;
    var element_bottom_position = (element_top_position + element_height);

    //check to see if this current container is within viewport
    if ((element_bottom_position >= window_top_position) &&
        (element_top_position <= window_bottom_position)) {


      if($element.is($('div').parent()) && !$element.hasClass('fadeInUp')) {
        cont++;
        var delay = MULTIPLIER * cont;

        $element.addClass('fadeInUp');
        //Pause animation.
        $element.addClass('paused');

        setTimeout(function() {
          //Start animation
          $element.removeClass('paused');
          cont--;
        }, delay);
      }else {
        $element.addClass('fadeInUp');
      }
    } else {
      $element.removeClass('fadeInUp');
    }
  });
}

$window.on('scroll resize', check_if_in_view);
$window.trigger('scroll');