Transparence pour tout les navigateurs !!!

Bonjour, je cherche un bout de css qui fonctionne sur le plus grand nombre de navigateur possible pour rendre transparant une partie du site ???

J'ai trouvé :

filter:alpha(opacity=82);
-moz-opacity:0.82;
opacity: 0.82;

Mais internet explorer 6 ne le reconnait pas !!

J'ai cherché et j'ai vue que c'etait chaud mais il doit bien exister une astuce !!!!
Modifié par Gsgsd (30 Dec 2006 - 22:53)

hello

je viens de récupérer cette petite ligne supplémentaire sur le site du W3C

filter: progid:DXImageTransform.Microsoft.Alpha(opacity=82);

ce qui donne pour toi

    filter: alpha(opacity=82);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=82);
    -moz-opacity: 0.82;
	opacity:0.82;

bon réveillon

Salut,

La syntaxe

filter:alpha(opacity=82);

fonctionne avec IE 6. Peut-on voir la page qui pose problème ?

Merci pour vos réponses, mais je me demande si il pourrait pas y avoir disons des parasites entre du code css ? parce que justement

filter:alpha(opacity=82);

Ne fonctionne pas avec IE 6 !!!

Je penses que le mieux c'est que je vous montre mon css pour vous me dites ce qui est faux !!!

Mon css
Pour voir ce que ça donne : Mon site

EDIT : Regarder la différence entre Firefox et IE 6...
Modifié par Gsgsd (31 Dec 2006 - 14:11)

bonjour,

si tu appliques le filtre sur la zone concernée , tu n'as plus aucun problemes.

#page {filter:alpha(opacity=85);}

bonne année !

a écrit :
si tu appliques le filtre sur la zone concernée , tu n'as plus aucun problemes.

Bah, moi j'ai essayé en reprenant toutes les informations données et aparement, le code donne super bien sur FF(résultats inespérés jusqu'alors), mais moi aussi, la transparence ne fonctionne pas sur IE 6, et IE 5 aussi d'ailleurs

Touvert

gcyrillus a écrit :
bonjour,

si tu appliques le filtre sur la zone concernée , tu n'as plus aucun problemes.

#page {filter:alpha(opacity=85);}

bonne année !

Alors moi j'ai essayé et ça marche toujours pas, par contre il y a un truc qui me chagrinne c'est que au début j'avais réussi jusqu'a je retape le site !!!


N.B: J'ai trouvé un truc pour avoir tout les navigateur sur mon ordi: Standalone et Portable browser

Sinon bonne année a tous !!!!!!

Bonjour,

Avec ça je n'ai généralement pas de problème ...

   opacity : 0.8;
   filter : alpha(opacity=80);

bonjour,

j'ai effectué ce test avec la dev tool bar de IE.

ci joint un screen : (clique pour le voir , reduction a 50%)


Je pense que ta page a aussi plusieurs soucis au niveau de la validité de ton code , verifie ton fichier css , puis html , cela n'aura que des effets positif sur l'affichage , l'accessibilité et le referencement .

Quand au filtre proprietaire de microsoft , le dernier ecrase le precedent , puis si il est mal ecrit (erreur de syntaxe) tu annule tout , tout simplement .

++

<edit> il y aussi que tu dois avoir les "activex" correspondant ou ne pas les bloqués (par soucis de securité peut-etre ?) .... javascript , regles css proprietaires ou gadget IE , même combat , pas sur que ça soit efficace a 100% .
</>
Modifié par gcyrillus (01 Jan 2007 - 22:25)

Hello (et bonne année)

La proprieté filter ne fonctionne que sur des éléments possédant le layout !

il faut donc par exemple que l'élément possède une largeur, une hauteur ou une position absolute :

http://msdn.microsoft.com/workshop/author/filter/reference/filters/alpha.asp

voilou

a écrit :

Hello (et bonne année)

La proprieté filter ne fonctionne que sur des éléments possédant le layout !

il faut donc par exemple que l'élément possède une largeur, une hauteur ou une position absolute :

http://msdn.microsoft.com/workshop/author/filter/reference/filters/alpha.asp

voilou

Ok merci. Mais c'est quoi un layout ?

pour le layout, c'est bien expliqué ici :

http://test.blog-and-blues.org/haslayout/trad_temp.html

Par exemple si je vous donne mon css pouvez vous m'aiderà le corriger comme la suggerer gcyrillus me dire ce qu'il faudrait faire pour le layout !!!

Mon CSS

Salut, vous m'avez parlé de Layout et j'ai trouve un site qui donné déjà des présentations en Layout
voila le site

J'ai pris le N°39 est je beau essayer de mettre

filter:alpha(opacity=55);

Rien à faire j'ai aucune transparence !!!

Si quelqu'un pouvait essayer à ma place car je débute et j'ai du faire une erreur, voila le code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Layout 39</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 3.1">
<style type="text/css">
html,body{margin:0;padding:0}
body{font: 76% arial,sans-serif;text-align:center}
p{margin:0 10px 10px}
a{display:block;color: #981793;padding:10px}
div#header h1{height:80px;line-height:80px;margin:0;
  padding-left:10px;background: #EEE;color: #79B30B}
div#container{text-align:left}
div#content p{line-height:1.4}
div#navigation{background:#B9CAFF}
div#extra{background:#FF8539}
div#footer{background: #333;color: #FFF}
div#footer p{margin:0;padding:5px 10px}

div#container{width:700px;margin:0 auto}
div#navigation{float:left;width:350px}
div#extra{float:right;width:350px}
div#footer{clear:both;width:100%}
</style>
</head>
<body>
<div id="container">
<div id="header"><h1>Header</h1></div>
<div id="wrapper">
<div id="content">
<p><strong>1) Content here.</strong> column long long column very long fill fill fill long text text column text silly very make long very fill silly make make long make text fill very long text column silly silly very column long very column filler fill long make filler long silly very long silly silly silly long filler make column filler make silly long long fill very.</p>
<p>very make make fill silly long long filler column long make silly silly column filler fill fill very filler text fill filler column make fill make text very make make very fill fill long make very filler column very long very filler silly very make filler silly make make column column </p>
<p>fill long make long text very make long fill column make text very silly column filler silly text fill text filler filler filler make make make make text filler fill column filler make silly make text text fill make very filler column very </p>
<p>column text long column make silly long text filler silly very very very long filler fill very fill silly very make make filler text filler text make silly text text long fill fill make text fill long text very silly long long filler filler fill silly long make column make silly long column long make very </p>
</div>
</div>
<div id="navigation">
<p><strong>2) Navigation here.</strong> long long fill filler very fill column column silly filler very filler fill fill filler text fill very silly fill text filler silly silly filler fill very make fill column text column very very column fill fill very silly column silly silly fill fill long filler </p>
</div>
<div id="extra">
<p><strong>3) More stuff here.</strong> very text make long column make filler fill make column column silly filler text silly column fill silly fill column text filler make text silly filler make filler very silly make text very very text make long filler very make column make silly column fill silly column long make silly filler column filler silly long long column fill silly column very </p>
</div>
<div id="footer"><p>Here it goes the footer</p></div>
</div>
</body>
</html>

Sinon je vais continuer de découvrir le layout.

Salut,
Juste une parenthèse ; tu oublies

-khtml-opacity:0.85;

Pour Safari et Konkeror.

Pour la transparence
> http://wiki.media-box.net/tutoriaux/html/transparence

Hermann a écrit :
Salut,
Juste une parenthèse ; tu oublies

-khtml-opacity:0.85;

Pour Safari et Konkeror.

Je sais, mais mon probleme c'est IE 6 (quand j'aurais résolu ce problème je le rajouterais)

Antoine Cailliau a écrit :
Pour la transparence
> http://wiki.media-box.net/tutoriaux/html/transparence

Merci mais c'est ce que j'utilise mais je n'arrive pas pour IE6, on m'a parlé de Layout si j'ai bien compris c'est une histoire de position de largeur et hauteur mais toujours le même problème avec IE6.

Voila mon CSS
Si quelqu'un voit l'erreur ?

Reprenont depuis le debut !!!

Est ce quelqu'un peut me faire une page simple avec un bloc transparent sur image d'arriere plan en css qui fonctionne sous ie6

ensuite j'essayerais de l'adapter et ma page

merci

Salut!

Quand c'est possible, j'utilise une image d'arrière-plan pour simuler la transparence (PNG-32), ce qui évite de devoir utiliser plusieurs propriétés "non-standard".

Il ne reste plus qu'IE6 sur la touche, avec l'archi-classique problème de la transparence des PNG, pour lequel tu devrais facilement trouver une solution en faisant une recherche sur le forum.