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

Question

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

$(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 docs关于如何操作这种特殊样式 background-color: rgba(70,103,26,0.1); 正如我在其他示例中看到的那样。

fiddle here

Answer 1

$(document).on('scroll', function (e) {

     var alpha = $(document).scrollTop() / 550;

     $('.navbar-default').css('background-color', 'rgba(70, 103, 26,' + alpha + ')');
});

JSFiddle Link