jsfiddle 如何获取 fiddle 中的 scrollTop 值

Question

我希望类在 scrolltop 达到 if 语句中指定的值时更改...

我不知道我犯了什么愚蠢的错误，我无法让它工作

Answer 1

您的代码有一些问题：

我认为 jQuery 没有 onscroll 功能
如果 $('#main' <- 这里
如果您错过了 scrollTop 函数的括号，请继续使用
您正在检查 main 的 scrollTop 值 - 它永远为 0，因为它从不滚动，您正在滚动 window

尝试以下操作（评论中的更改）；

$(window).on('scroll', function() { // change to scroll rather than onscroll
  var scrollTop = $(this).scrollTop(); // get scroll top of the thing that is scrolling and cache for better performance
  if (scrollTop > 100) {
    $("#container").addClass("red");
  } else if (scrollTop > 500) {
    $("#container").removeClass("red").addClass("blue"); // chain actions
  } else {
    $("#container").removeClass("red blue"); // you can pass two classes into this
  }
});

如果您在 fiddle 中使用它并检查容器，您会看到 class 已添加（您不会看到它在 [= 之前离开屏幕时改变颜色29=] 变化)

jsfiddle 如何获取 fiddle 中的 scrollTop 值

jsfiddle how do I get the scrollTop value inside a fiddle

jquery

scroll

jsfiddle