更改页面不透明度.click jquery

可以说我的页面有4个div元素，它们都嵌套在一起。我想添加一个不透明度级别，以便在除最后一个嵌套元素之外的每个元素上面，当我为ex指定一个表单元素时触发该级别。到目前为止，我有这个：更改页面不透明度.click jquery

$(window).load(function(e){ 
    $('#main-user-signup').on('click',function(e){ 
    $("#main-site-header").css("opacity",.1).fadeIn(300, function() {    
     $('#sign-up-text-home').css({'z-index':9999}); 
    }); 
    e.preventDefault(); 
    }); 
});

2个问题。

＃sign-up-text-home也获取不透明层。它嵌套在＃main-site-header内。
我该如何更改不透明层的颜色，而不是实际的背景颜色。

来源

2014-02-23 KelpyG

如果你改变了透明度具有子元素的元素，它们都将受到影响。
你可以在背景颜色中使用rgba的不透明部分，如下所示：rgba(0, 0, 0, 0.1)。最后一个值是颜色的不透明度。

编辑：

$("#main-site-header").animate({ 
    background-color: rgba(0, 0, 0, 0.1), 
}, 300, function() { 
    // finish 
});

来源

2014-02-23 23:40:05 Papa

将bgcolor添加到$（“＃main-site-header”）中正确的语法是什么css（“opacity”，。1）.fadeIn（300，function（）{ – KelpyG

我想用animate代替fadeIn。将RGB值更改为套件。 – Papa

如果更改其所有子也将受到同样的不透明度值应用于元素的不透明度值。

但是，正如@Papa指出的，您可以编辑一个元素的背景颜色不透明度值，而不会影响任何子元素的不透明度值。这里是一个如何用jQuery实现的例子，感谢this SO的回答。

// Some randomly selected colour value 
var color = '#abcdef'; 
var rgbaCol = 'rgba(' + parseInt(color.slice(-6,-4),16) 
    + ',' + parseInt(color.slice(-4,-2),16) 
    + ',' + parseInt(color.slice(-2),16) 
    +',0.5)'; // This colour value will be at half opacity. 
$('div').css('background-color', rgbaCol)

否则，如果你想要的文字和父母div内的其他元素褪色过，那么你将不得不让他们看起来像它在须藤父div前面创建单独的div s的绝对定位。

来源

2014-02-24 00:01:23 Hassaan

更改页面不透明度.click jquery

回答

相关问题