窗口滚动上的移动元素

【问题标题】：Moving element on Window scroll窗口滚动上的移动元素
【发布时间】：2018-07-12 10:27:56
【问题描述】：

您会在这个 JsFiddle https://jsfiddle.net/xpvt214o/402281/ 中看到在窗口滚动的另一个图像中滚动的图像。如何修改以下内容，使其在碰到该元素（在所有 br 标签之后）之前不会开始滚动？我试过抵消它，但没有得到任何地方。

如果它只是滚动慢很多也很好。

jQuery(document).ready(
function() {

var $w = $(window);
var $d = $('.oh');

$(window).scroll(function(event) {
  var st = $w.scrollTop();

  _x = st;

  lastScrollTop = st;

  $d.css('bottom', _x);      

});

});

这是我正在努力实现的示例https://www.sketchapp.com/

【问题讨论】：

标签： window scrolltop

【解决方案1】：

我发现这个可以满足我的需求

https://codepen.io/JTParrett/pen/BkDie

$.fn.moveIt = function(){
var $window = $(window);
var instances = [];

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

window.addEventListener('scroll', function(){
var scrollTop = $window.scrollTop();
instances.forEach(function(inst){
  inst.update(scrollTop);
});
}, {passive: true});
}

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

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

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

【讨论】：