使用 JavaScript 更改 Bootstrap 3 导航栏的背景不透明度

changing the background opacity of a Bootstrap 3 navbar with javascript

本文关键字：背景 不透明度 导航 JavaScript 更改 Bootstrap 使用      更新时间：2023-09-26

我在向下滚动页面时尝试更改元素的不透明度，但是我的元素背景颜色不会改变

$(document).on('scroll', function (e) {
    $('.navbar-default').css('background-color: rgba',"70","103","26",($(document).scrollTop() / 550));
});

我的 CSS

.navbar-default {
   /* background-color: #1b1d2a;  */
    background-color: rgba(70,103,26,0.1);
    border-color: #1b1d2a;
}

我的问题似乎是不理解 jQuery .css（） API 文档，介绍如何操作这种特定样式background-color: rgba(70,103,26,0.1);因为我在其他示例中看到此方法有效。

在这里摆弄

$(document).on('scroll', function (e) {
     var alpha = $(document).scrollTop() / 550;
     $('.navbar-default').css('background-color', 'rgba(70, 103, 26,' + alpha + ')');
});

JSFiddle Link

相关文章：