javascript - 在 js 中设置背景颜色 + 不透明度，除了按钮

Question

当发生某些事情时，我将 body background-color 设置为灰色并降低 opacity。然而，这显然也会改变按钮的不透明度。

我想要实现的是当 Action 发生时，改变除按钮以外所有内容的不透明度。

var highlight = $('#' + scroll).closest('div').find('button');
$('body').css('opacity', '0.2');
$('body').css('background-color', 'grey');
$(highlight).css('background-color', '#FDFF47');
$(highlight).css('opacity', '1');

如何做到这一点？

Answer 1

在 background-color 中使用 rgba() 来减少背景的不透明度。不需要 opacity 属性。

$('body').css('background-color', 'rgba(128, 128, 128, 0.5)');

关于 rgba(R, G, B, A) - https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#rgb()_and_rgba()