Problème de superposition d'éléments

**navis84** · 20/10/2006, 10h17

Bonjour,

je vous explique la disposition du site. Il y a un menu déroulant vertical. Sous une partie déroulante, il y a un objet Flash. Or, lorsque la partie du menu en question est déroulée, le texte superposant l'objet Flash passe derrière et devient donc invisible.

J'ai essayé d'utiliser la propriété z-index, mais cela ne change rien :

Code CSS :

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

1
2
3
4
5
6
object {
z-index: 1;
}
#menu dd {
z-index: 2;
}

Auriez-vous une idée ?

Merci d'avance !
@+

**Bisûnûrs** · 20/10/2006, 10h31

La propriété z-index ne fonctionne que sur des éléments positionnés (position:relative|absolute).

**navis84** · 20/10/2006, 10h42

Voici un complément sur #menu :

Code CSS :

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

1
2
3
4
#menu {
 position: absolute;
 z-index:100;
}

Je viens d'ajouter une position pour l'objet :

Code CSS :

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

1
2
3
4
object {
	z-index: 1;
	position: relative;
}

Mais cela ne change rien...

J'ai aussi testé la solution proposée par ce site, mais cela marche sous IE et non Firefox...

**Bisûnûrs** · 20/10/2006, 10h58

Rajoute cette ligne à ton object :

Code HTML :

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

<param name="wmode" value="opaque" />

**navis84** · 20/10/2006, 11h06

Cela ne change rien...

Voici le code mon objet :

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
12
<OBJECT classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
	WIDTH='195' HEIGHT='115' id='flash' ALIGN=''>
	<PARAM NAME=movie VALUE='flash.swf'>
	<PARAM NAME=quality VALUE=high>
	<PARAM NAME=bgcolor VALUE=#FFFFFF>
 
	<PARAM NAME='wmode' value='transparent' />
	<EMBED src='flash.swf' quality=high bgcolor=#FFFFFF  WIDTH='195' HEIGHT='115'
 	NAME='flash' ALIGN=''
	TYPE='application/x-shockwave-flash'
	 PLUGINSPAGE='http://www.macromedia.com/go/getflashplayer' WMODE='transparent'></EMBED>
 </OBJECT>

J'avais remplacé "transparent" par "opaque" pour ton test.

**Bisûnûrs** · 20/10/2006, 11h16

Tu n'as pas besoin de tout ça pour faire fonctionner ton anim flash :

Code HTML :

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

1
2
3
4
5
6
<object type="application/x-shockwave-flash" data="flash.swf" width="195" height="115" id="flash">
   <param name="movie" value="flash.swf" />
   <param name="wmode" value="opaque" />
   <param name="quality" value="high" />
   Texte alernatif
</object>

En n'oubliant pas les z-index.

J'ai testé et ça fonctionne : http://josselin.willette.free.fr/test.html

**navis84** · 20/10/2006, 11h37

OK, merci.

Cela doit venir de mon poste.

En effet, j'ai testé avec un autre poste qui est sur Windows et cela marche sous IE et Firefox.
Par contre, sous Linux, cela ne fonctionne pas. (que ça soit ton test ou le mien)

Aurais-tu une idée pour résoudre ce problème sous Linux ?