jQuery的 - 紅寶石軌道 - 淡入淡出所有分區

我想jQuery淡入淡出背景顏色的一個div（錯誤類），同時保持內部的div不變。但在Chrome和Firefox中，「error」div和內部div中的任何文本都會變淡。在IE中它的作品，只是錯誤的div被褪色，但沒有任何div裏面。我如何爲所有瀏覽器工作？jQuery的 - 紅寶石軌道 - 淡入淡出所有分區

簡而言之，我不希望任何內部div都褪色。

視圖 -

<div class="error" style="display: inline-block;z-index:1;"> 
<div style="position:relative;z-index:2;">Error: <%= @a[:error] %> 
</div> 
</div>

HTML -

<div class="error" style="z-index:1;height=300px;width=500px;"> 
<div style="position:relative; z-index:2;">Error: some error</div> 
</div>

的JavaScript -

$(document).ready(function(){ 
$(".error").fadeTo("slow",0.20); 
});

來源

2012-04-16 Kapish M

這是發生，因爲所有元素的默認backgronud實際上是透明的。內部div的透明背景顯示外部div的變化背景。

爲了防止出現這種情況，只需在錯誤div內爲div指定明確的背景，例如與此css：

.error div { background: white; }

即'給任何div div內的類「錯誤」白色背景。

來源

2012-04-16 03:14:34

試過了，沒有給出預期的結果。可能是我沒有正確解釋。錯誤div有背景顏色紅色，這應該由jquery淡出。內部div只有一些黑色的文字，我不想讓jquery褪色。它將保持原樣。 – 2012-04-16 03:23:04

查看我的回答here關於使用fadeTo。簡單的答案是fadeTo不會讓你這樣做，因爲不透明度適用於所有子女。使用動畫並設置背景顏色使其alpha爲0.

來源

2016-08-21 21:52:25 Kolichikov

我認爲你最好在這個更老的問題上寫出完整的答案;然後將新問題標記爲重複。 – 2016-08-21 22:12:41

jQuery的 - 紅寶石軌道 - 淡入淡出所有分區

回答

相關問題