更改頁面不透明度.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

回答

相關問題