javascript - 滚动量后更改 CSS

Question

我想在滚动 800px 后覆盖 CSS 代码，如果小于 800 则还原。我有这段代码:

Javascript:

$(window).scroll(function() {
    if ($(window).scrollTop() >= 800) {
        $('#nav').css('background', 'rgba(0, 0, 0, 0)');
    } else {
        $('#nav').attr('background', 'rgba(0, 0, 0, 0.8)');
    }
});

Answer 1

尝试以下操作:

$(window).scroll(function () {
    if ($(window).scrollTop() >= 100) {
        $('#nav').css('background-color', 'rgba(0,0,0,0)');
    } else {
        $('#nav').css('background-color', '');
    }
});

您使用的是 background 而不是 background-color。您可以将 else 语句的第二个属性替换为您希望它恢复到的任何内容。上面的示例将默认返回样式表中的任何内容。

这是一个关于 JSFiddle 的工作示例:https://jsfiddle.net/tz245uky/3/