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

Question

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

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

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()