CAN IE7顯示兩個不同不透明度的div在另一個之上？

我正在嘗試構建一個簡單的淡入淡出效果。我使用兩個包含圖像的div。兩者都有「位置：絕對」屬性和負Z指數。CAN IE7顯示兩個不同不透明度的div在另一個之上？

我將補間函數應用於Firefox和Chrome中的不透明度樣式屬性。我爲IE使用過濾器：alpha（opacity = foo）。

我看到我的'舊'圖像淡出，但是'新'圖像立即顯示在我的'舊'圖像的頂部，不管z-index和不透明度值如何。

我知道IE7有一些不透明的問題，但我不確定這是否是其中之一。我使用JPEG文件，而不是.PNG。任何人都可以解釋我做錯了什麼嗎？

一些代碼：

var temporaryDiv = document.createElement("div"); 
var temporaryDivImage = document.createElement("img"); 
document.body.appendChild(temporaryDiv); 
temporaryDiv.appendChild(temporaryDivImage); 
temporaryDivImage.src = backgroundPictures[currentPicture + 1];   
temporaryDiv.setAttribute("style", "overflow: hidden; filter: alpha(opacity=0); position: absolute; z-index: -2;");  
document.body.appendChild(temporaryDiv); 

var background = document.getElementById("background");   

if (isIE7 == true) {   
    Tweens[0] = new Tween(temporaryDiv.style, "filter", Tween.linearIn, 0, 100, 2000, "alpha(opacity=", ")");  
    Tweens[1] = new Tween(background.style, "filter", Tween.linearIn, 100, 0, 2000, "alpha(opacity=", ")"); 
}

CSS：

body { 
    margin: 0px; 
    width: 100%; 
    height: 100%; 

} 

#background {  
    position: absolute; 
    overflow: hidden; 
    z-index: -1; 
}

非常感謝

來源

2011-05-23 Mansiemans

您是否嘗試過佈局添加的這些元素的IE7？即對於這兩個元素（你想改變其不透明度）設置CSS屬性「縮放」（即特定）與值「1」，看看是否有幫助。通常，這有助於:)

來源

2011-05-23 18:22:33 oddy

謝謝！我只是通過將所有的z-index改爲正整數來意外地解決了這個問題，我會明白你的解決方案明天是否會工作太多.. – Mansiemans 2011-05-23 20:54:17

CAN IE7顯示兩個不同不透明度的div在另一個之上？

回答

相關問題