Javascript 滚动时更改标题的颜色

我将直接切入主题，基本上我希望我的标题从透明（css中没有背景属性）变为滚动的白色背景色

我正在使用这个JavaScript，但没有任何进展

$(window).scroll(function() {
    var changeNav = 'rgba(0, 0, 0, 0.36)'
    if ($(window).scrollTop() > 200) {
        changeNav = '#ffffff';
    }
    $(.header).css('background-color', changeNav);
});

还有，有没有办法让它自己回去？所以我在页面的底部，标题有一个白色的

背景色

，但是当我翻到顶部时，JavaScript会去掉这个属性吗？我一直在四处玩耍和寻找，但什么也找不到

注意：我从堆栈溢出上的另一个地方获得了这段JavaScript

非常感谢

$（.header）

应该是

$（.header”）

您的脚本也可以“简化”为：

注意上述操作将强制每个卷轴上的

.header

背景颜色发生变化（甚至从#fff变为#fff）。若要利用该功能，并确保即使用户调整窗口大小，您也拥有正确的颜色，请使用：

$( function () { // DOM ready to be manipulated

   var $header = $(".header"); // Cache elements for intensive actions
   $(window).on("scroll resize", function() {
       if($(this).scrollTop() > 200){
           $header.css('background-color', "#fff" );
       }else{
           $header.css('background-color', "rgba(0, 0, 0, 0.36)" );
       }
   });

});

Ofc，让sue知道您已将jQuery库包含在文档的

中：

<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>

---

您是否链接了jquery？该代码是JavaScript，或者更好的方法是调用JavaScript库，因此您需要包含/调用该库才能使用它。请参阅我的演示以获取jsBin上的示例

<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>