如何独立于屏幕尺寸，在相同位置保持更快的滚动div？

问题描述

为了使不同的data-scroll-speed属性具有不同的滚动速度，我使用了以下js：

$.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 = this.el.attr('data-scroll-speed');
};

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

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

我的问题是，如果我调整浏览器窗口的大小，图像的垂直位置（我使用此js，而主要内容却具有默认速度）会发生变化，即图像出现在主窗口的不同区域内容;如何使它们保持独立于屏幕尺寸的准确位置？

主要内容已经完全响应（字体大小在vw中指定，更快的滚动图像根据屏幕宽度调整大小，等等。）

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）