Comment faire pour que la transparence de l'image fonctionne sur IE

Question

J'ai une image GIF qui a un ensemble alpha, et quand mon site se charge dans Firefox 3.0, il agit de manière transparente sur les parties de l'image qui le devraient. Cependant, lorsque j'essaie de charger l'image GIF dans IE7, elle revient en tant que bloc solide. En fait, c'est comme si la couleur de l'image saignait dans la zone transparente.

Quelqu'un at-il des suggestions pour résoudre ce genre de problème? Les pointeurs sur quoi regarder, ou un itinéraire que vous avez utilisé pour résoudre ce genre de problème. J'ai contrôlé cela en CSS - et bien que je veuille éviter la route des commentaires conditionnels et plusieurs CSS, je serais prêt si la suggestion montre de façon tangible comment je peux résoudre les problèmes de compatibilité IE.

Merci, Sean

Answer 1

Je ne me souviens pas avoir jamais eu un problème avec les gifs transparents dans IE (n'importe quelle version).

Tout d'abord essayez de charger l'image par elle-même - cela vous dira si c'est l'image ou certaines règles CSS vont de travers.

Si cela ne fonctionne toujours pas, essayez de le réenregistrer avec un autre programme. Le gimp fera l'affaire. Edit: C'est au niveau CSS donc je vérifierais quelles règles ont la couleur d'arrière-plan qui apparaît ... j'espère que ça devrait être facile de trouver un candidat probable. Changez la couleur en # ff0000 et vérifiez si l'image change comme prévu. Ensuite, comprendre pourquoi cette règle montre sur IE mais pas FF. Si vous avez une URL pour la page, je pourrais jeter un oeil.

Answer 2

Essayez ces deux - mess avec les chiffres jusqu'à ce que vous obtenez droite. Je 4get qui est pour IE et qui est FF/chrome

opacity: 7; 
filter: alpha(Opacity=7); 

Answer 3

J'ai corrigé un problème de transparence gif en basculant sur png. IE7 rend correctement les canaux alpha png.

L'impression de png transparents ne fonctionne toujours pas correctement dans IE7.

Answer 4

C'est bizarre - j'ai trouvé le problème dans ce que je pensais était en commentaire des déclarations dans le fichier CSS:

//margin-top: 46px; 
//background-color: #377696; 

qui était dans l'élément qui contenait les deux images.

J'ai annulé chaque réponse. Merci!