使用jQuery更改数据滚动速度？

我正在使用下面的代码更改某些元素的滚动速度。我从中复制的代码

为了再次检查我的总体代码，我还对“.a-line”添加了颜色更改

if/else取决于“#image ul”是否完全位于浏览器窗口的底部边缘之上

我的问题是，无论是调整浏览器窗口的大小还是滚动浏览器窗口，“.lamposon-a-line”的颜色都会发生变化，但其他元素上的数据滚动速度不会发生变化。当（重新）加载时，它们会这样做

最初，首次加载网页时，代码会设置正确的数据滚动速度。但是当调整浏览器窗口的大小时——为了改变“#image ul”是否完全位于浏览器窗口的底部边缘之上——数据滚动速度不会改变，直到我刷新网页（因此id和类名是正确的）

我需要更改数据滚动速度，而无需刷新浏览器窗口。谁能看出我做错了什么

<script>
  // Assign attribute specific "data-scroll-speed" to elements upon loading, resizing and scrolling of the webpage page. "if/else" is depending on if #image-ul is fully above the bottom edge of the browser window.
  $(document).ready(function() {
    $(window).on('load resize scroll', function() {
      var WindowScrollTop = $(this).scrollTop(),
        Div_one_top = $('#image-ul').offset().top,
        Div_one_height = $('#image-ul').outerHeight(true),
        Window_height = $(this).outerHeight(true);
      if (WindowScrollTop + Window_height >= (Div_one_top + Div_one_height)) {
        $('#sloganenglish').attr('data-scroll-speed', '2');
        $('.slow-scroll-slider').attr('data-scroll-speed', '5');
        $('.slogan-a-line').css('color', 'green');
      } else {
        $('#sloganenglish').attr('data-scroll-speed', '1');
        $('.slow-scroll-slider').attr('data-scroll-speed', '1');
        $('.slogan-a-line').css('color', 'red');
      }
    }).scroll();
  });


  // data-scroll-speed script
  $.fn.moveIt = function() {
    var $window = $(window);
    var instances = [];

    $(this).each(function() {
      instances.push(new moveItItem($(this)));
    });

    window.onscroll = function() {
      var scrollTop = $window.scrollTop();
      instances.forEach(function(inst) {
        inst.update(scrollTop);
      });
    }
  }

  var moveItItem = function(el) {
    this.el = $(el);
    this.speed = parseInt(this.el.attr('data-scroll-speed'));
  };

  moveItItem.prototype.update = function(scrollTop) {
    var pos = scrollTop / this.speed;
    this.el.css('transform', 'translateY(' + -pos + 'px)');
  };

  // Initialization
  $(function() {
    $('[data-scroll-speed]').moveIt();
  });
</script>

//加载、调整和滚动网页时，为元素指定特定于属性的“数据滚动速度”。“if/else”取决于图像ul是否完全位于浏览器窗口的底部边缘之上。
$（文档）.ready（函数（）{
$（窗口）。在（'load resize scroll'，function（）上{
var windowscorltop=$（this）.scrollTop（），
Div_one_top=$（'#image ul'）.offset（）.top，
Div#u one_height=$（“#图像ul”）.outerHeight（真），
窗口高度=$（此）.outerHeight（真）；
如果（WindowScrollTop+窗高>=（Div\u one\u top+Div\u one\u height））{
$（“#sloganenglish”）.attr（'data-scroll-speed'，'2'）；
$（'.slow-scroll slider'）.attr（'data-scroll-speed'，'5'）；
$（'.a-line'）.css（'color'，'green'）；
}否则{
$（“#sloganenglish”）.attr（'data-scroll-speed'，'1'）；
$（'.slow-scroll slider'）.attr（'data-scroll-speed'，'1'）；
$（'.a-line'）.css（'color'，'red'）；
}
}).scroll（）；
});
//数据滚动速度脚本
$.fn.moveIt=函数（）{
变量$window=$（window）；
var实例=[]；
$（this）.each（function（）{
push（newmoveItem（$（this））；
});
window.onscroll=函数（）{
var scrollTop=$window.scrollTop（）；
实例.forEach（函数（inst）{
安装更新（滚动顶部）；
});
}
}
var moveItItem=函数（el）{
this.el=$（el）；
this.speed=parseInt（this.el.attr（'data-scroll-speed'）；
};
MoveItem.prototype.update=函数（scrollTop）{
var pos=滚动顶部/此速度；
this.el.css（'transform'，'translateY（'+-pos+'px'）；
};
//初始化
$（函数（）{
$（“[数据滚动速度]”）.moveIt（）；
});

查看答案

//
//默认速度是最低有效滚动速度。
//
var默认速度=1；
//
//速度增量定义加速度的增加/减少
//当前滚动速度和数据滚动速度之间
//
var速度_增量=0.01；
//
//元素的最大滚动速度
//
变量数据\u滚动\u速度\u a=4；//#口号英语
变量数据\u滚动\u速度\u b=5；/。标语
//
//
//
var增加速度、减少速度、目标速度、当前速度、速度增量；
$（文档）.ready（函数（）{
$（窗口）。在（'load resize scroll'，function（）上{
var windowscorltop=$（this）.scrollTop（），
Div_one_top=$（'#image ul'）.offset（）.top，
Div#u one_height=$（“#图像ul”）.outerHeight（真），
窗口高度=$（此）.outerHeight（真）；
如果（WindowScrollTop+窗高>=（Div\u one\u top+Div\u one\u height））{
$（'sloganenglish'）.attr（'data-scroll-speed'，data-scroll-speed'.attr（'data-current-scroll-speed'，default\u speed'）.attr（'data-speed-increments'，data-scroll\u speed\u a*speed\u increment）；
$（'.gloss-a-line'）.attr（'data-scroll-speed'，data\u scroll\u speed\u b.）.attr（'data-current-scroll-speed'，default\u speed.）.attr（'data-speed-increments'，data\u scroll\u speed\u b*speed\u incrementer）；
$（'.a-line'）.css（'color'，'yellow'）；
增加速度=真；
降低速度=错误；
}否则{
$（'sloganenglish'）.attr（'data-scroll-speed'，'1'）.attr（'data-current-scroll-speed'，默认速度）；
$（'.glosson-a-line'）.attr（'data-scroll-speed'，'1'）.attr（'data-current-scroll-speed'，默认速度）；
$（'.a-line'）.css（'color'，'red'）；
降低速度=真；
增加速度=错误；
}
}).scroll（）；
});
//数据滚动速度脚本
$.fn.moveIt=函数（）{
变量$window=$（window）；
var实例=[]；
$（this）.each（function（）{
push（newmoveItem（$（this））；
});
window.onscroll=函数（）{
var scrollTop=$window.scrollTop（）；
实例.forEach（函数（inst）{
安装更新（滚动顶部）；
});
}
}
var moveItItem=函数（el）{
this.el=$（el）；
this.speed=parseInt（this.el.attr（'data-scroll-speed'）；
该电流速度=1.0；
};
MoveItem.prototype.update=函数（scrollTop）{
target_speed=parseInt（这个.el.attr（'data-scroll-speed'）；
当前速度=此。当前速度；
speed_increments=parseFloat（这个.el.attr（'data-speed-increments'）；
如果（增加速度）{
if（当前速度<目标速度）{
当前速度+=速度增量；
}否则{
当前速度=目标速度；
}
}否则，如果（降低速度）{
如果（当前速度>默认速度）{
当前速度-=速度增量；
}
if（$（窗口）.scrollTop（）==0）{
当前速度=默认速度；
}
}
此参数。当前速度=当前速度；
var pos=滚动顶/this.current\u速度；
this.el.css（'transform'，'translateY（'+-pos+'px'）；
};
//初始化
$（函数（）{
$（'[data-s]
    //
// default speed ist the lowest valid scroll speed.
//
var default_speed = 1;
//
// speed increments defines the increase/decrease of the acceleration
// between current scroll speed and data-scroll-speed
//
var speed_increment = 0.01;
//
// maximum scroll speed of the elements
//
var data_scroll_speed_a = 4; // #sloganenglish
var data_scroll_speed_b = 5; // .slogan-a-line
//
//
//
var increase_speed, decrease_speed, target_speed, current_speed, speed_increments;
$(document).ready(function() {
     $(window).on('load resize scroll', function() {
         var WindowScrollTop = $(this).scrollTop(),
             Div_one_top = $('#image-ul').offset().top,
             Div_one_height = $('#image-ul').outerHeight(true),
             Window_height = $(this).outerHeight(true);
         if (WindowScrollTop + Window_height >= (Div_one_top + Div_one_height)) {
             $('#sloganenglish').attr('data-scroll-speed', data_scroll_speed_a).attr('data-current-scroll-speed', default_speed).attr('data-speed-increments', data_scroll_speed_a * speed_increment);
             $('.slogan-a-line').attr('data-scroll-speed', data_scroll_speed_b).attr('data-current-scroll-speed', default_speed).attr('data-speed-increments', data_scroll_speed_b * speed_increment);
             $('.slogan-a-line').css('color', 'yellow');
             increase_speed = true;
             decrease_speed = false;
         } else {
             $('#sloganenglish').attr('data-scroll-speed', '1').attr('data-current-scroll-speed', default_speed);
             $('.slogan-a-line').attr('data-scroll-speed', '1').attr('data-current-scroll-speed', default_speed);
             $('.slogan-a-line').css('color', 'red');
             decrease_speed = true;
             increase_speed = false;
         }
     }).scroll();
 });


 // data-scroll-speed script
 $.fn.moveIt = function() {
     var $window = $(window);
     var instances = [];

     $(this).each(function() {
         instances.push(new moveItItem($(this)));
     });

     window.onscroll = function() {
         var scrollTop = $window.scrollTop();
         instances.forEach(function(inst) {
             inst.update(scrollTop);
         });
     }
 }

 var moveItItem = function(el) {
     this.el = $(el);
     this.speed = parseInt(this.el.attr('data-scroll-speed'));
     this.current_speed = 1.0;
 };

 moveItItem.prototype.update = function(scrollTop) {

     target_speed = parseInt(this.el.attr('data-scroll-speed'));
     current_speed = this.current_speed;
     speed_increments = parseFloat(this.el.attr('data-speed-increments'));

     if(increase_speed){
         if(current_speed < target_speed){
              current_speed += speed_increments;
         } else {
            current_speed = target_speed;
         }
     } else if(decrease_speed){
         if(current_speed > default_speed){
            current_speed -= speed_increments;
         }
         if($(window).scrollTop() === 0){
            current_speed = default_speed;
         }
     }
     this.current_speed = current_speed;
     var pos = scrollTop / this.current_speed;
     this.el.css('transform', 'translateY(' + -pos + 'px)');
 };

 // Initialization
 $(function() {
     $('[data-scroll-speed]').moveIt();
 });