28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous

j'ai un petit soucis étrange que je n'arrive pas à résoudre.
Sur une même page, j'ai un menu déroulant en css dans un div en z-index:3 et une animation flash dans un autre div en z-index:1
L'ouverture du menu déroulant passe au-dessus de l'animation flash. Or, lorsque certains clips sont animés dans l'animation, ils transparaissent au travers des cellules du menu déroulant... voir le destructure complètement.

J'ai eu y'a quelques temps un autre soucis similaire : Un flash dans un div en z-index:1 et un autre div en z-index 2. Le chevauchement des div se fait mais l'animation flash reste au premier plan, à travers le div supérieur. J'avais résolu le problème en masquant le div inférieur à l'apparition du supérieur mais, faut avouer, c'est une solution un peu bidon.

Quelqu'un aurait-il déjà été confronté à ce soucis, et aurait peut-être une piste à m'indiquer...

Merci à tous
A+R.
Comment insères-tu l'animation flash dans ta page ?
Si tu utilises la balise embed, ca fait parfois foirer les superpositons.
Je l'insère "à la dream", avec une balise embed à l'intérieur d'une balise object.
Je ne sais pas trop comment faire autrement. Peut-on ne pas mettre la balise embed et malgrès tout être comptatible avec tout les navigateurs ?

A+R.
Bonjour à toi et bienvenu sur le Forum,

En ce qui concerne ta question à propos de l'insertion Flash, voici un lien qui devrait t'aider :
Comment rendre valide une animation Flash ?

Concernant les problèmes de superposition que tu rencontre, je crains que san un petit morceau de code pour l'exemple, nous ne puissions être d'une grande utilité...

Enfin, sache que d'une manière générale, Flash se positionne toujours au premier plan.
Je ne sais pas si l'on peut qualifier ce comportement de bug, mais il est reconnu...
Tu trouveras sur le net quelques pistes pour contourner ce problème dans ce sujet : Div Anim Flash >> arrière plan PB
Hello,

Yahrou, après un test sans <embed>, avec simplement <object>, le résultat est pire en fait.

Cygnus, je te remercie de ta réponse riche. En creusant un peu, notamment le forum d'Alsacreations...

J'ai finalement trouvé 2 topics sur le même sujet :

http://forum.alsacreations.com/topic-23-15372-1-Menu-droulant-horizontal--Flash-gt-Problme-de-Zindex.html

http://forum.alsacreations.com/topic-1-10542-1-Menu-droulant-au-dessus-de-flash.html

En effet en combinant le paramêtre wmode de la balise et une intégration avec swfObject ( http://blog.deconcept.com/swfobject/ ), après quelques tests rapides, ça semble prometteur...

Je vais approfondir ça, notamment avec ou sans <embed>. Après tout, si ça ppeut être valide W3 tant qu'à faire...

A suivre après le weekend.

Merci à vous 2

A+R.
salut,
tout ce qu'il y a de plus simple (ça doit te faire plaisir à entendre non ? Smiley smile )
insère ton anim avec swfobjectshttp://blog.deconcept.com/swfobject/
ajoute le paramètre
so.addParam("wmode", "transparent");

et hop le tour est joué, flash ne fait plus, euh, ne nous casse plus les pieds... magique, (et valide, et compatible safari, IE6+ (en dessous je ne sais pas, pas essayé, FF, et tout et tout Smiley smile )

Et t'inquiète, même si tu as une image de fond dans l'anim, pas de problème, ça marche, le but recherché ici n'est pas que l'anim soit transparente (ceci dit, ça sert aussi parfois, vécu...), mais l'effet secondaire bigrement utile.

have swing
Ce n'est pas le swfobject qui rend la superposition posible mais l'utilisation du wmode.

Par contre ce n'est pas fiable a 100%, Safari bug parfois et garde le flash au premier plan, et si ceux-ci son visualisés avec ce même navigateur et des versions plus anciennes (avant la 7) du player flash ça ne marche pas du tout.
:) salut,
non, non, pas miracle du tout, ni un coup d'ailleurs Smiley smile
c'est vrai que safari a parfois du mal avec cette methode dans le cas de menus déroulant, il peut lui arriver de faire un drôle de canevas mais dans l'ensemble ça marche. C'est vrai aussi que c'est vrai pour les versions récentes du player, c'est vrai aussi que ça ne marche pas sur netscape 4 qui ne gère pas la transparence de flash (si, si, vécu aussi).

C'est vrai aussi que c'est le wmode qui rend le truc possible, c'est bien pour ça que je dis de l'ajouter, swfobjects permet en revanche d'implémenter flash de façon valide, solide, "plutôt" compatible et de jouer avec facilement.

Ce qui est vrai aussi, c'est qu'après de heures de taf, de hacks divers à coup de commentaires conditionnels pour IE avec un z-index négatif (si, si, on voit toujours l'anim dans IE, elle disparait avec les autres navigateurs), etc, etc, j'avais fini par trouver une solution qui marchait mais ne me satisfaisait pas parce que pas très élégante et verbeuse (comme moi là...) et cette simple constatation me permet aujourd'hui, sous la menace de l'agence Smiley smile de développer tranquillement un site dont certaines pages sont carrément posées sur une anim flash qui occupe toute la surface utile de la page et d'y travailler en xhtml/css complètement valide et solide (bon, bien sûr, en y rajoutant même quelques fading et autres à coup de javascript/mootools, je n'allais tout de même pas me laisser em... par les flasheurs sans réagir Smiley smile exactement comme si je travaillais par-dessus une image de fond.

Maintenant, j'essaye juste d'aider en disant les choses avec le sourire, désolé, la prochaine fois, je la ferai ayatollah css over sérieux et parlerai sémantique plutôt que magie, ce sera sûrement plus dans le ton, sorry.

Have swing
Oye man, t'emportes pas!

C'était pas contre ta solution mon comentaire, je l'utilise aussi (avec plein d'effet js magiques aussi Smiley cligne )!, c'était juste pour dire que dans la mesure du possible le plus simple c'est d'éviter ce genre de superposition.

En fait il y a des milliers de bidouilles géniales qui permettent de faire des truc génials mais c'est vrai qu'ici même si des fois la passion nous emporte il faut pas oublier le théme principal du forum, qui est quand même l'accessibilité. (ce ci dit je dit ça mais j'ai donné plein de solutions pas du tout accessibles mais bon on apprend...)
Modifié par matmat (15 Apr 2007 - 21:16)
Laurent Denis a écrit :
Tiens, encore le coup de la méthode miracle...


Salut Laurent,

Tu peux nous en dire plus stp ? Tu ne sembles pas vraiment emballé. Smiley cligne

Bien que cette technique ajouter une surcouche JS, elle présente quand même de nombreux avantages non ?
@ matmat, t'inquiète, ce n'est pas ton post qui m'a enflammé mais la réaction du vizir de ces lieux... je ne prétends pas détenir le savoir absolu, comme je le dis je cherche juste à aider mais, simplement, j'ai pris pour habitude de dire les choses avec le sourire et pas les mots qui ronflent.

Pas de recette miracle en perspective, juste la bagarre avec ces trucs-là depuis l'époque (le vizir était probablement en culottes courtes) où on en bavait à essayer d'introduire une dose de code propre en pleine guerre sun/microsoft, ça rend réaliste et humble à la fois, de temps en temps, il faut plier face à la réalité (et les DA aussi parfois Smiley smile ), ou plutôt faire au mieux avec, tout en attendant et en espérant la suite mais aussi, en prenant son pied à jouer avec. C'est pour ça que je signe toujours Have swing, le reste...

@ sous peu

Have swing