Javascript 设置带有滚动事件的翻译很慢

Question

我在根据滚动事件值设置transform:translateY();时遇到问题。

基本上，#moveme会在滚动事件触发时消失。

检查这个 fiddle 的实时 Action :https://jsfiddle.net/bo6e0wet/1/

这是代码:

HTML

<div id="moveme"></div>

JS

$(window).on("scroll", function() {

  var currentScroll = $(this).scrollTop();  

  if (currentScroll <= 50) {

    $("#moveme").css("transform", "translate3d(0," + -currentScroll + "px, 0");

  }

});

为什么moveme没有完全换尿布？是不是因为scroll事件触发太多，所以DOM没有快速获取到？

我尝试用触摸板滚动非常慢的速度。它运行完美。

但是如果我按CTRL + 向下箭头，这意味着强制滚动到页面底部。 moveme 卡住了。

如何解决这个问题？

我的代码有什么问题吗？

提前致谢...

Answer 1

更改此条件:

if (currentScroll <= 50)

更高的东西，比如

if (currentScroll <= 75)

因为currentScroll从39跳到65，所以它错过了50点，并且只翻译-39 Fiddle ;