Opacité image en CSS valide

**jorisvh** · 02/11/2006, 12h20

Bonjour,

Quelqu'un sait-il coment modifier l'opacité d'une image, un peu comme ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.opak { filter:alpha(opacity=100); -moz-opacity: 1; }

Mais en CSS valide.

Merci beaucoup,

Jorisvh.

**Bisûnûrs** · 02/11/2006, 12h23

Tant que les navigateurs ne se seront pas mis d'accord pour une syntaxe commune de cette fonctionnalité ça ne sera pas valide.

Donc, pour l'instant il n'y a pas de solution.

Ou alors générer le CSS en Javascript au chargement de la page, il ne sera pas dans ton fichier CSS et donc passera au validateur.

**Candygirl** · 02/11/2006, 12h31

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.opak { opacity:1;}

Fonctionne sur les navigateurs récents (FF1.5 et +, opera9, safari, netscape 8) mais pas IE7, sauf erreur...

ça devrait être valide lorsque le validateur passera en css3 mais il est clair que c'est invalide css2 puisque cela n'en fait pas partie.

Perso je trouve un bon compromis de laisser opacity dans le css et mettre le spécial IE dnas un commentaire conditionnel.

**Sword'** · 02/11/2006, 12h45

Il faut que tu enregistre ton image en .png et que tu applique une balise <meta> dans ton <head> mais ne j'arrive plus a mettre la main dessus...

**trotters213** · 02/11/2006, 12h50

Envoyé par Sword'

Il faut que tu enregistre ton image en .png et que tu applique une balise <meta> dans ton <head> mais ne j'arrive plus a mettre la main dessus...

IE ne gère pas les png translucide

Tu peux utiliser ceci avec le Javascript comme l'a dit BisounoursJos :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
opacity:0.5; 
filter:alpha(opacity=50); 
-moz-opacity:0.5; 
-khtml-opacity:0.5;

ça couvre tous (presque tous ?? il y en a tellement

) les navigateurs mais c'est contourner les erreurs et non les résoudre

**jorisvh** · 02/11/2006, 13h30

OK, je vais faire ca. Merci beaucoup.

**Sword'** · 02/11/2006, 19h37

Tu changes ton image sur un logiciel (gimp, toshop, paint.net) et avec le nouveau IE sa passe car il gère le .png (bonne nouvelle)

Opacité image en CSS valide

CSS

Discussions similaires

Partager

Partager