Bonjour,

J'ai un problème lorsque j'essaie d'animer une DIV contenant un PNG transparent sous la série des IE (7,8)

En effet, la transition d'une opacité de 0 vers 1 masque l'image par une opacité noir.

Exemple:

CSS:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
#maDiv
{
    opacity:0
    background:url('images/mon_PNG_transparent.png');
    width:980px;
    height:600px;
}
Code:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
 
$('#maDiv').animate({'opacity':1},3000);

Donc en gros, ma div contenant le png transparent est au chargement du navigateur sur une opacité de 0 (donc invisible)

Ensuite, une animation de 3 seconde est lancée pour que l'opacité de cette DIV atteigne une opacité de 1 (maximum).

Pendant cette transition, le PNG transparent devient tout NOIR (on ne voit donc plus l'image), quand la transition de 3 secondes est terminée, ce noir disparait et l'image apparait...

Inutile de vous dire que ce bug est uniquement lié à Intermerde Explorer et que tout fonctionne à merveille sous FF, Chrome, Safari, Opéra, etc.

Quelqu'un sait comment fixer le problème?

Un grand merci!