Problème Flash swfobject + Thickbox avec Safari/Opera

Bonsoir,

Je bosse en ce moment sur un site pour un collectif d'artiste sur lequel il y a un bandeau flash pour lequel j'ai utilisé le script swfobject afin de viré ce satané liseré chez les utilisateurs qui usent encore de ce navigateur. Jusque là tout va bien, mon bandeau s'affiche parfaitement quelque soit le navigateur. Pour information voici le code concerné :

<div id="top" style="z-index:0;">Flash Player requis.</div>
<script type="text/javascript">
var so = new SWFObject("img/top.swf", "top", "800", "200", "8", "#000000");
so.write("top");
</script>

Ensuite, pour une des fonctions du site j'utilise le script thickbox qui me permet d'afficher du contenu par dessus ma page sans avoir à utiliser de pop-up. Mais voilà comme il arrive toujours une c****** (ce serait beaucoup moins drole sinon), sous Safari et Opera mon bandeau flash reste au dessus de mon contenu thickbox. J'ai essayé de jouer sur le z-index (à 100 dans le css thickbox) en mettant à 0 celui de ma div contenant le bandeau, mais sans résultat. Voici le css correspondant à la div contenant mon bandeau flash :

#top {
	position: relative;
	margin: 0;
	padding: 0;
	width: 800px;
	height: 200px;
	z-index: 0;
}

J'ai cherché un petit moment sur le forum et sur le web en général si je ne pouvais pas trouver quelque chose pour répondre à mon problème mais en vain.
Merci par avance, et bonne soirée.

EDIT
J'ai oublié de préciser qu'avec le code "normal" de flash (sans swfobject) je n'ai pas ce problème. C'est pour ça que j'insiste sur le rapport swfobject/thickbox. Voilà
Modifié par kloh (12 Oct 2007 - 22:01)

salut,

Cela n'a rien à voir avec Thickbox, mais avec l'intégration shockwave dans le html. Il se résoud par le paramêtre wmode lors de l'intégration du flash.

avec swfobject, il suffit d'ajouter une ligne :

var so = new SWFObject("img/top.swf", "top", "800", "200", "8", "#000000");
so.addParam("wmode","transparent");
so.write("top");

Il n'est pas nécessaire de spécifier le z-index du div "top".
En revanche, attention de ne pas donner le même ID (ici "top") au div et au swf. A corriger...

Mais... Bin oui y'a un "mais", si le swf passe ainsi sous les éléments de thickbox, il reste néanmoins réactif à la souris, cliquable, etc...
Ce qui peut se résoudre en spécifiant au swf que Thickbox est activé ou désactivé.

tu peux facilement ajouter une petite fonction à la fin du fichier thickbox.js du genre :

function MessageAuSwf(){
var LeSwf = document.getElementById("IDduSwf");
LeSwf.NomFonctionSWF();
}

Il faut ensuite ajouter à 2 endroits dans thickbox.js:
MessageAuSwf();

> à la première ligne de la fonction "tb_show" et la dernière ligne de la fonction "tb_remove"

Reste ensuite à paramêtrer le swf avec
ObjectDeConnectionJS = ExternalInterface.callback("NomFonctionSWF",null,"MessageAuSwf");

et de créer bien sur une petite fonction on/off du nom "NomFonctionSWF"

Voir l'aide actionscript de ExternalInterface

C'est pas compliqué, réactif.

A+R.

Bien sur, je n'ai pas préciser de rajouter la ligne

import flash.external.ExternalInterface;
avant le addcallback.

Mais tout ça sort un peu du thème du forum et c'est dans l'aide flash...