5568 sujets

Sémantique web et HTML

Bonjour,

Je rencontre actuellement un problème avec l'utilisation de l'utilitaire DewSlider sur Firefox pour afficher une suite de 3 images en loop infini.

Le site en question: effacé

J'arrive à le faire tourner sans aucun soucis sous Internet explorer 6,7 et 8, les images insérées dans le fichier xml sont bien affichées à l'écran comme il faut (avec l'effet de loop infini).

Mais une fois que j'ouvre Firefox (version 3.0.5) l'animation flash ne s'affiche pas. J'ai à la place une zone blanche, et quand je clique droit sur celle-ci, la fenêtre de Flash (qui indique entre autre le liens vers votre site) m'indique "Erreur de chargement xml".

Y aurait-il une syntaxe différente à adopter? (Ou un paramétrage de Firefox à changer?)

Voici la syntaxe que j'ai utilisée et insérée dans mon code html :


<object type="application/x-shockwave-flash"data="/squelettes/dewslider.swf?xml=/squelette/dewslider.xml" width="816" height="128"><param name="movie" value="/squelettes/dewslider.swf?xml=/squelettes/dewslider.xml" /></object>


avec, dans le même répertoire que le fichier qui appelle cet object, le fichier dewslider.swf et un fichier nommé dewslider.xml

voici le contenu de mon fichier dewslider.xml :


<?xml version="1.0" ?>
<album
showbuttons="no"
showtitles="no"
randomstart="no"
timer="5"
aligntitles="bottom"
alignbuttons="bottom"
transition="fade"
speed="20"
>
<img src="/squelettes/img/rub/r1_1.jpg" title="Titre 1" />
<img src="/squelettes/img/rub/r1_2.jpg" title="Titre 2" />
<img src="/squelettes/img/rub/r1_3.jpg" title="Titre 3" />
</album> 


Je précise que j'utilise SPIP et que mes rubriques étant personnalisées, j'ai 6 autres fichiers .xml appelés dewslider-r1.xml ... dewslider-r6.xml, appelant des images différentes, cela fonctionne très bien sous IE.

Le code source d'un exemple (la rubrique 1, rubrique-1.html) atteignable ici : xxx/spip.php?rubrique1
( cliquer sur un autre lien, même au sein de la rubrique, appelera un autre squelette de page donc restez dessus Smiley cligne )


#CACHE{24 * 3600 * 1000}
<BOUCLE_rubrique_principal(RUBRIQUES) {id_rubrique} {lang_select}>
	
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html xml:lang="fr" lang="fr">
<head>
<title>[(#TITRE|textebrut|supprimer_numero)] - [[(#NOM_SITE_SPIP|textebrut)]][ - (#DESCRIPTIF|textebrut)]</title>
<INCLURE{fond=inc/inc-meta}{lang}{id_article}>
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations.css}" type="text/css" />
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations_big.css}" type="text/css" />
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations_print.css}" type="text/css" />
<link rel="stylesheet" href="#CHEMIN{css/menu-deroulant.css}" type="text/css" />
<link rel="shortcut icon" type="image/x-icon" href="#CHEMIN{img/favicon.ico}" />
<script type="text/javascript" src="#CHEMIN{access/styleswitcher.js}"></script>
<script type="text/javascript" src="#CHEMIN{access/flashdetect.js}"></script>
<script type="text/VBScript" src="#CHEMIN{access/flashdetect.vbs}"></script>

<!--[if gte IE 7]>
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations_ie7.css}" type="text/css" />
<![endif]-->

<!--[if lte IE 6]>
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations_ie6.css}" type="text/css" />
<![endif]-->

<![if !IE]>
<link rel="stylesheet" href="#CHEMIN{css/xxx_formations_ff.css}" type="text/css" />
<![endif]>


</head>
<body id="xxx_formations">

<div id="conteneur">
  <div id="bandeau">
			 <INCLURE{fond=inc/inc-bandeau-logo}>
			 
			 <INCLURE{fond=inc/inc-banniere-r1}>
			 
  </div>
	
	
	
  <div id="menu_deroulant">
			 		<INCLURE{fond=inc/inc-menu-deroulant}{id_rubrique}{lang}>
	</div>
	
	<div id="menu_deroulant_ombre">
		<div id="ombre_bug_ie"></div>
  </div>


	
	<div id="conteneur_contenu">
	  
    <div id="bloc_gauche">
    		 
  			 <div id="menu_gauche">
				 <INCLURE{fond=inc/inc-menu-gauche}{id_rubrique}{id_article}{lang}>
    		 </div>
  			 
    		 <div id="menu_gauche_logo_anthropedia">
  			 <INCLURE{fond=inc/inc-menu-gauche-logo-anthropia}>
    		 </div>
  			 
    </div>

    <div id="contenu" class="contenu0">
		
		<INCLURE{fond=inc/inc-rubrique}{id_rubrique}{lang}>
		
		
    </div>
    
    <div id="menu_droite">
		<INCLURE{fond=inc/inc-menu-droite}{id_rubrique}{lang}>
    </div>
		
	</div>
  
  <div id="pied_de_page">
  </div>

</div><!-- fin conteneur" -->




</body>
</html>

</BOUCLE_rubrique_principal>
<INCLURE{fond=404}{lang}{id_rubrique}>
<//B_rubrique_principal>


Le fichier include inc-banniere-r1 appelé dans rubrique-r1.html et qui traite l'appel du xml :


<div id="banniere_r1">
<object type="application/x-shockwave-flash"data="/squelettes/dewslider.swf?xml=/squelette/dewslider-r1.xml" width="816" height="128"><param name="movie" value="/squelettes/dewslider.swf?xml=/squelettes/dewslider-r1.xml" ></object>            
</div>


(Au passage le site est en cours de réalisation, et Firefox génère quelques erreurs d'affichage de divs(n'essayez même pas sous Opéra ça plante). Mais ce n'est pas le sujet de toute façon.)

Merci d'avance pour votre aide !


PS : j'utilisai un script pour détecter la présence de Flash ou non sur l'ordinateur du visiteur, afin d'afficher le Flash ou une image de fond dans le cas contraire. Ce script ne marchant pas sous Mac, je l'ai finalement retiré au profit d'une image de fond dans le div contenant l'anim flash. Si vous connaissez un script universel permettant de détecter la présence de flash sur la machine utilisateur je suis preneur.
Modifié par vahadar (03 Mar 2009 - 08:15)
Hello,

vahadar a écrit :

PS : j'utilisai un script pour détecter la présence de Flash ou non sur l'ordinateur du visiteur, afin d'afficher le Flash ou une image de fond dans le cas contraire. Ce script ne marchant pas sous Mac, je l'ai finalement retiré au profit d'une image de fond dans le div contenant l'anim flash. Si vous connaissez un script universel permettant de détecter la présence de flash sur la machine utilisateur je suis preneur.
Comme ton flash est intégré de manière valide (cf. ce point de la FAQ qui en parle) il ne manque plus qu'un DIV ou un P après les <param ... /> :
<object type="application/x-shockwave-flash" data="fichierflash.swf" width="604" height="20">
<param name="movie" value="fichierflash.swf" />
<param name="wmode" value="transparent" />
<p>Image ou texte alternatif à styler en css</p>
</object>
Bonjour Heyoan et merci pour votre aide !

J'ai donc suivi votre conseil et inséré le code ci-dessous ce qui devrait résoudre mon problème de détection de flash.

inséré dans l'include inc-banniere-r1 utilisé dans l'exemple de mon précédent article

<div id="banniere_r1">
<object type="application/x-shockwave-flash" data="/squelettes/dewslider.swf?xml=/squelette/dewslider-r1.xml" width="816" height="128">
<param name="movie" value="/squelettes/dewslider.swf?xml=/squelettes/dewslider-r1.xml" />
<param name="wmode" value="transparent" />
				 
<img src="/squelettes/img/rub/r1_1.jpg" title="Image de Fleur, Bandeau acceuil" alt="Image de Fleur, Bandeau acceuil" border="0" width="816px" height="128px" />
				 
</object>            
</div>


D'autre part, pour ma culture perso, est-ce le fait d'indiquer dans le tag objet un data
data="blablablahopla.swf"
qui fait que FF affiche l'animation ?

cf le lien en anglais dans la faq que vous m'avez indiqué
When I tried out the data attribute, I nearly had kittens, as movies suddenly started playing in Netscape and Mozilla. Flipping back to IE revealed that the movies played there too.

<object
type="application/x-shockwave-flash" data="movie.swf"
width="400" height="300">
<param name="movie" value="movie.swf" />
</object>


edit : Bon j'ai mal tappé mon code, ça marche très très bien merci encore !

edit2 : En fait j'ai toujours bien le problème de l'animation non affichée sous FF 3.0.5 et j'ai passé un peu vite ce thread en résolu Smiley cligne . Grace à la solution de Heyoan cela contourne le problème (la transparence ajoutée) mais j'ai toujours, si je fais un clic droit sur la zone flash, un message "erreur de chargement xml".

J'ai le player en version 10.

Si quelqu'un a une idée?

Bien cordialement.
Modifié par vahadar (18 Jan 2009 - 17:36)
vahadar a écrit :

D'autre part, pour ma culture perso, est-ce le fait d'indiquer dans le tag objet un data
data="blablablahopla.swf"
qui fait que FF affiche l'animation ?
Oui. Et l'équivalent dans <param name="movie" ... est utile pour IE (et peut-être d'autres ?)

Sinon je suggérais d'utiliser un DIV ou un P car une image purement décorative (comme cela semble être le cas ici) devrait se trouver dans le code css (présentation) et pas dans le code html (contenu).

Pour finir je ne vois pas d'où vient le problème avec FF 3.0.5 mais je n'avais mis <param name="wmode" value="transparent" /> que parce qu'il était dans l'exemple de la FAQ. Smiley cligne
Rebonjour,

En fait le css du div "banniere_r1" de l'exemple et qui englobe le tag <object> est défini ainsi :


#banniere_r1 {
position: absolute;
top: 0px;
right: 0px;
width: 816px;
height: 128px;
background-color: #00325B;
background-image:url(/squelettes/img/rub/r1_1.jpg);
background-repeat: no-repeat;
background-position: top right;
}


Donc en principe il y avait déjà une image de background, mais qui n'était pas visible car le paramètre transparent n'était alors pas défini dans l'<object>.

J'avais rajouté l'<img> pour faire comme la soluce. En fait j'ai maintenant un doublon, à la fois l'image de backgrond du div englobant l'<object> et l'<img> appelé dans l'object même.
J'ai donc enlevé l'<img> de l'<object> et testé ça, en effet pas besoin de l'<img>, le background-image marche très bien avec la transparence sous FF.

Juste pour info. Donc problème inconnu avec le flash même si votre solution m'aide beaucoup déjà !

Bonne soirée.

Cdt


edit : en revanche j'ai un doute, comment se comportera l'affichage dans le cas ou Flash n'est pas présent? (N'ayant pas la possibilité de testé ce cas) L'<object> sera-t-il ignoré?
Dans ce cas j'ai deux questions :

1- est ce que le paramètre transparent fonctionnera tout de même ?
ce qui implique que la div qui englobe l'objet affichera bien l'image de fond

2- dans le cas contraire si l'absence de flash entraine la non application de la transparence, la div englobante ne se verra pas? donc nécessité d'une <div> après le tag <param> comme vous l'indiquez?

J'imagine à 99% que ce paramètre de transparence dépend de <object> et n'est pas spécifique à flash. Donc mes 2 questions sont certainement inutiles, mais je voudrai en être certain Smiley smile

Merci d'avance
Modifié par vahadar (18 Jan 2009 - 19:09)
Si le plugin flash n'est pas présent rien ne sera affiché à l'exception de ce que tu auras mis après le dernier <param ... /> donc si tu ne mets rien on ne verra que ton DIV d'arrière-plan.
C'est bien ce que je supposais. Merci Heyoan pour la confirmation.

Je laisse le sujet ouvert si l'un d'entre-vous à une suggestion pour FF3.
Je revenais te dire que pour tester la non présence du plugin il suffit d'utiliser Opera (Outils / Préférences Rapides / Activer les plugins) et comme j'ai vu que tu avais mis un lien vers ta page il me semble bien qu'il manque un s ici :
data="/squelettes/dewslider.swf?xml=/squelette[b][#red]s[/#][/b]/dewslider-r1.xml"
Un grand merci à toi Heyoan,

Tu viens de trouver la clef du mystère ^^ Et comme le data est pris en compte par FF comme tu l'expliquais, pas étonnant que cela ne marchait pas !

Un grand merci encore Smiley biggrin

Comme quoi on cherche souvent une aiguille alors que c'est souvent une poutre Smiley cligne

Je ferme le sujet.

Bonne soirée.

Bien cordialement.
Modifié par vahadar (18 Jan 2009 - 21:05)