與父div具有不同的不透明度值

Question

divStatus有幾個控件。一個是btnStatus，這是隱藏的。在mouseoverbtnStatus顯示和divStatus's不透明度下降到0.5。我希望btnStatus具有不透明度1。但下面的代碼不起作用。 btnStatus仍具有不透明度值0.5。

$("#divStatus").mouseover(function() { 
    $("#divStatus").css("opacity", "0.5"); 
    $("#btnStatus").show(); 
    $("#btnStatus").css("opacity", "1"); 
}); 

JSFiddle

Answer 1

你不能這樣做。父級不透明度值影響所有子元素。

但是，您可以將btnStatus置於divStatus之外，並將divStatus設置爲絕對位置，並將btnStatus置於divStatus之上。您可以單獨控制兩個不透明度值。

jsfiddle example:http://jsfiddle.net/cp0c50pd/

Answer 2

我只能建議用 「RGBA顏色」 而不是 「不透明度」

檢查了這一點：http://jsfiddle.net/z9hmdm7a/

background: rgba(0,0,0,1); 

Answer 3

效果相同:::::: = =>http://jsfiddle.net/6vuqg97x/1/

enter code here