Javascript jQuery滚动和更改类

我正在尝试向我的站点添加以下功能：当用户在页面上向下滚动超过400像素时，页面的第一部分应为不透明度：0.4。这是我已经尝试过但失败的代码：

if($("html, body").offset().top >= 400){$("#main").addClass("scrolled");}

.scrolled {opacity:0.4;}

jquery函数可以工作，所以我想没有语法错误

---

谢谢您的回答。

我想您是在寻找

.scrollTop（）

而不是

.offset（）.top

，它会导致一个负数

html，body

已经有了

.offset（）.top

到

0

@页面加载，当您在y轴滚动时会产生一个负数：

if($(document).scrollTop() >= 400){
     $("#main").addClass("scrolled");
}

如果您想使用

.scrollTop（）

，请使用

$（文档）

作为选择器，我想您已经有了

.scroll

事件

---

注:

---

$（“html，body”）.offset（）.top

此选择器会导致负

.offset（）.top

，因为

html，body

已经具有

.offset（）.top

轴x/y到

0

当触发

DOMContentLoaded

事件时。因此，当您垂直滚动时，实际上是滚动到y轴，y轴是一个负数

您希望回调

$。滚动

，每次滚动位置改变时都会调用它，然后检查是否足够远

$(document).scroll(function(){
    // check the document scroll position
    if($(document).scrollTop() >= 400){
         $("#main").addClass("scrolled");
    } else {
         // if you also want to put #main back to normal
         $("#main").removeClass("scrolled");
    }
});

---

.

在

Developer工具中调试代码
add
console.log（“test1”）在if条件下检查它是否在if条件下进入。非常感谢，但它不起作用。我放了录像，你可以看一下@雨果，我想我需要更多的背景。问题可能在别处。我在我的答案后面加了一个JSFIDLE，这样你就可以看到它在工作了。耶，我很抱歉，现在它工作了，我不明白，为我对你所做的问题感到抱歉，我才14岁，我不是超级程序员：）我只是改变了一些想法，突然它工作了。谢谢：）我很高兴你拿到了。不要担心，因为看似微小的细节而陷入困境是很常见的。继续编码！