28173 sujets

CSS et mise en forme, CSS3

Affichage d'une animation flash au premier plan

Pour info, j'ai remarqué que dans une mise en page en css, quoi qu'on fasse une animation flash a tendance à se mettre au premier plan dans certains navigateurs sur certaines plateformes.

Et j'ai remarqué aussi que si on enlève la balise 
<embed>
on n'a plus ce problème, et on peut jouer avec le z-index pour mettre un bloc au premier plan par dessus l'animation.

Avez vous rencontré ce genre de problème, avez-vous trouvé une meilleure solution car dans certains cas on doit passer des paramètres obligatoirement dans la balise 
<embed>
n'est-ce pas...
Salut,

moi je l'inserre comme ça (sans embed donc)

<div class="flash">
<object type="application/x-shockwave-flash" data="dewplayer.swf?son=./img/Amon_Tobin.mp3" width="200" height="19"> 
 <param name="movie" value="dewplayer.swf?son=./img/Amon_Tobin.mp3" /> 
 </object>
</div>


et je viens d'essayer, pas moyen de jouer avec le z-index e nposition absolue par rapport à un autre bloc en absolue....

Tu m'intrigues....
Modifié par Hum (17 Dec 2006 - 20:57)
Merci,

c'est vrai que j'utilise object et que je mets le fond transparent, mais dans l'animation, souvent, il n'y a pas que le fond et que les objets vectoriels, les textes et images passent par dessus un bloc html qui serait positionné au premier plan (par exemple un champ texte qui permet de s'inscrire à une newsletter).

Par ailleurs, si le flash fait appel à des infos dynamiques, mon collègue développeur (là je décroche, je n'y connais rien...) me disait qu'il était obligé pour passer les variables d'utiliser cette fameuse balise embed fort dépréciée.

Que peut-on faire ?
Moi j'ai réussi à passer le flash en arrière, voici le code :
		<div id="header"><!-- debut header -->
				<div id="flag">
					<a href="#"><img src="charte/drapeau-en.gif" alt="English version" height="15" width="24" border="0" /></a>
				</div>
	<!-- ################################################### -->
				<div id="newsletter">
						<form id="FormName" action="#" method="get" name="FormName">
								<label>Newsletter</label>

								<input type="text" name="nom" value="abonnez-vous" size="24" accesskey="X" />
								<input type="image" class="btok" src="charte/btok.gif" alt="OK" title="OK" />
						</form>
				</div>
	<!-- ################################################### -->
				<div id="flash"><!-- debut flash -->
					<object type="application/x-shockwave-flash" data="portail.swf" width="888" height="231">
						<param name="wmode" value="Transparent" />
						<param name="movie" value="portail.swf" />

						<param name="quality" value="high" />
						<param name="menu" value="false" />
						<div>
						<!-- mettre ici le contenu en html : -->
						Ce contenu requiert Flash Player.
  	<a href="http://www.macromedia.com/go/getflash/">Obtenir Flash</a>
  						</div>
					</object>
				</div><!-- fin flash -->

	<!-- ################################################### -->
			</div><!-- fin header -->


et voici le code de la css

#header { 
	margin: 0 auto;
	width: 888px;
	height: 239px;
	position: relative;
}
#flash {
	z-index: 1;
	padding-top: 8px;
	width: 888px;
	height: 231px;
}
#flag {
	z-index: 2;
	position: absolute;
	top: 46px;
	left: 864px;
	height: 15px;
}

#newsletter {
	z-index: 30;
	position: absolute;
	top: 67px;
	left: 648px;
	width: 240px;
	height: 22px;
	background: #8f0000;
	color: white;
	font-size: 14px;
	font-weight: bold;
	clear: right;
}


Si je rajoute la balise embed, ça ne marche plus !

Je pense que je ne suis pas le seul à m'être heurté à ce genre de problème avec Flash qui prend le dessus si j'ose dire, sur le z-index, et que sur cet excellent forum, quelques témoignages seront bienvenus sur ce sujet !
Modifié par luxe-campagne (17 Dec 2006 - 21:12)
Sujet clos
Aller à