Jquery 当元素进入视口时设置动画

我创建了水平滚动，并尝试在viowport中设置元素动画。请帮我找出这有什么问题

Jquery

var $animation_elements = $('.animation-element');
    var $window = $(window);

    function check_if_in_view() {
      var window_width = $window.width();
      var window_left_position = $window.scrollLeft();
      var window_right_position = (window_left_position + window_width);
 
      $.each($animation_elements, function() {
        var $element = $(this);
        var element_width = $element.outerWidth();
        var element_left_position = $element.offset().left;
        var element_right_position = (element_left_position + element_width);
 
        //check to see if this current container is within viewport
        if ((element_right_position >= window_left_position) &&
            (element_left_position <= window_right_position)) {
          $element.addClass('in-view');
        } else {
          $element.removeClass('in-view');
        }
      });
    }

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

var$animation_elements=$（'.animation element'）；
变量$window=$（window）；
函数检查\u如果\u在\u视图（）中{
var window_width=$window.width（）；
var window_left_position=$window.scrollLeft（）；
变量窗口右位置=（窗口左位置+窗口宽度）；
$.each（$animation\u元素，function（）{
var$element=$（此）；
var element_width=$element.outerWidth（）；
var element_left_position=$element.offset（）.left；
变量元素右位置=（元素左位置+元素宽度）；
//检查当前容器是否在视口中
if（（元素右位置>=窗口左位置）&&
（元素左位置）