Может ли IE7 отображать два div с разной непрозрачностью друг на друге? - PullRequest
Новая
       21

Может ли IE7 отображать два div с разной непрозрачностью друг на друге?

2 голосов
/ 23 мая 2011

Я пытаюсь создать простой эффект кроссфейдера.Я использую два div, содержащие изображения.Оба имеют атрибут «позиция: абсолют» и отрицательный z-индекс.

Я применяю функцию анимации к атрибуту стиля непрозрачности в Firefox и Chrome.Я использую фильтр: альфа (opacity = foo) для IE.

Я вижу, как мое «старое» изображение исчезает, но «новое» изображение сразу отображается с полной непрозрачностью, поверх моего «старого» изображения, независимо от 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;
}

Большое спасибо

1 Ответ

0 голосов
/ 23 мая 2011

Вы пытались добавить макет к этим элементам для ie7?Т.е. для обоих элементов (для которых вы хотите изменить непрозрачность) установите свойство css «zoom» (т.е. специфичное) со значением «1» и посмотрите, поможет ли это.Обычно это помогает:)

...