Javascript 切换和滚动时更改Boostrap导航栏背景色

我有一些我正在使用的代码，但它并不是我想要的（不精通js/jquery）

我正在尝试设计引导导航栏。特别是，我希望它有一个背景颜色，这取决于它被切换，或页面被滚动。我现在有它，所以它正确地适用于滚动，它正确地适用于当我切换菜单。但是，当我在切换菜单的情况下滚动，然后在切换菜单的情况下滚动页面时，背景颜色会下降，并且再次变为透明

我可以理解为什么代码中会出现这种情况，我只是不知道如何正确地创建或组合这些函数，以便两者同时工作

抱歉，如果描述是褶边，该网站是在我的本地安装，所以我不能提供一个链接，但这里是一个链接到我的视频

为了清楚起见，我需要黑色渐变背景在页面顶部的切换菜单打开时仍然应用，但在菜单未打开时不应用。你可以在视频中看到它掉下来了

任何帮助都将不胜感激

它使用wordpress引导菜单，下面是我一直使用的代码：

jQuery(".navbar").on("show.bs.collapse", function() {
    console.log("open")
      jQuery(".navbar").css("background-color", "rgba(0,0,0,0.69)");
  });
  
  jQuery(".navbar").on("hide.bs.collapse", function() {
    console.log("close")
      jQuery(".navbar").css("background-color", "transparent");
  });


  
  jQuery(function() {
    jQuery(window).on("scroll", function() {
        if(jQuery(window).scrollTop() > 50) {
            jQuery(".navbar").css("background-color", "rgba(0,0,0,0.69)");
        } else if (jQuery(window).scrollTop() < 50) {
          
            
           jQuery(".navbar").css("background-color", "transparent");
        }
    });
  });

jQuery（.navbar”）.on（“show.bs.collapse”，function（））{
控制台日志（“打开”）
css（“背景色”，“rgba（0,0,0,0.69）”；
});
jQuery（“.navbar”）.on（“hide.bs.collapse”，function（））{
控制台日志（“关闭”）
jQuery（“.navbar”）.css（“背景色”、“透明”）；
});
jQuery（函数（）{
jQuery（窗口）.on（“滚动”，函数（）{
if（jQuery（window）.scrollTop（）>50）{
css（“背景色”，“rgba（0,0,0,0.69）”；
}else if（jQuery（window）.scrollTop（）<50）{
jQuery（“.navbar”）.css（“背景色”、“透明”）；
}
});
});