jquery - 当父 div 淡出时保持按钮不透明

Question

我最近开始为我的一个 friend 的艺术元素建立一个网站，到目前为止一切都很好。我正在使用 jQuery 使我的 bootstrap jumbotron fadeOut 到 0.6 不透明度，当你悬停时，以及使用按钮制作一个新的 div。我遇到的问题是，当我将鼠标悬停在超大屏幕上时，它会淡出并且出现按钮，但是按钮也是不透明的。请帮助我，我最近刚完成 codecademy 上的 jQuery 类(class)，很高兴能继续使用它。

js fiddle - https://jsfiddle.net/rsgf7w3u/

Jquery

$(document).ready(function(){
$('.jumbotron').mouseenter(function(){
    $('.jumbotron').stop().fadeTo('fast', .6);
    $('.jumbotron').prepend('<div id="view-gallery"><button>View Gallery</button></div>');

});
$('.jumbotron').mouseleave(function(){
    $('.jumbotron').stop().fadeTo('slow', 1);
    $('#view-gallery').remove();
});

});

CSS

.jumbotron {
background-image:url("mc.jpg");
height:400px;
background-repeat:no-repeat;
background-size:cover;

}
#view-gallery button {
width:200px;
height:50px;
background-color:#2F2D30;
border-radius:1px;
border:none;
color:white;
}

Answer 1

不透明度不容易覆盖 - 您可以尝试 rgba 技巧。我更新了你的 fiddle :https://jsfiddle.net/rsgf7w3u/4/

background-color:rgba(47,45,48);

引用:Opacity !important doesn't work