ordre des evenements...

9 réponses

Etienne SOBOLE

08/12/2004 à 16:15

salut.
j'ai une petite question concernant l'ordre des evenements.
Expose du probleme:

1 - j'ai une image de fond sur laquelle j'ai géré l'évènement onmousedown
(qui affiche 'fond')

2 - j'ai positionné un div absolu sur ce fond .j'ai egalement géré
l'évènement onmousedown (qui affiche 'div') et qui fait un
event.cancelBubble = true;
pour eviter que l'evenement de l'image de fond ne se déclanche... jusque la
tout va bien... ca marche

3 - j'ai un deuxieme div qui vient au dessus de tout ca (il est
translucide!) et qui ne doit pas générer d'evenement. c'est à dire que
j'aimerai que tout marche comme lorsqu'il n'est pas la. sauf que lorsque je
clique, ce n'est pas le div (celui du 2) qui recoit l'evènement, mais
l'image de fond, pourtant c'est bien sur le div (2) que j'ai cliqué...

Donc ma question c'est comment faire pour que lorsque je clique sur le div
(2) au travers du div (3) qui est translucide et qui me permet donc de voir
le div (2), cela m'affiche 'div' et non 'fond'.

voila. bon si c'est pas clair je mettrai un exemple en ligne ;)

merci
Etienne

9 réponses

Etienne SOBOLE

08/12/2004 à 17:59

bon finalement un petit exemple ca aide.
http://extranet.webshaker.net/test/div/index.php

bon alors en réalisant cet exemple j'ai compris que je n'etais qu'un buse et
que l'ordre d'appel est l'ordre du dom (ce qui est logique) et absolument
pas l'ordre de profondeur des couche de layer (non mais de fois on a le
cerveau en panne)...

donc evidement lorsqu'on clique sur le partie rouge grisée si je puis dire,
c'est bien fond qui récupère l'evenement...

alors logiquement j'ai mis le div2 dans le div1 en me disant que ca allait
arranger mes affaires.
en ben non !
http://extranet.webshaker.net/test/div/index2.php
la position est absolue par rapport au div2... bon soit.... je corrige et
j'arrive a la v3.

http://extranet.webshaker.net/test/div/index3.php

nous y voila.
le probleme c'est que si je clique sur le fond ca marche
si je clique sur le rouge ca marche
si je clique sur le rouge grisé ca marche
mais si je clique sur le fond grisé ca ne marche plus. il a envoyé le
message au dov pere (donc le div2) et la on se demande bien pourquoi!

Bref comment je fais pour solutionne mon problem ?

Michel Claveau - abstraction méta-galactique non triviale en fuite perpétuelle.

08/12/2004 à 18:36

Bonsoir !

As-tu essayé de gérer l'évènement uniquement au niveau du body, mais en le
discriminant avec un "event.srcElement.id" ?

@-salutations
--
Michel Claveau

Etienne SOBOLE

08/12/2004 à 20:07

As-tu essayé de gérer l'évènement uniquement au niveau du body, mais en le
discriminant avec un "event.srcElement.id" ?

Je vais essayer, mais je t'avoue que je doute que ca résolve mon probleme.

En fait on touche aux limites du DOM qui considère qu'un objet est une zone
incluse (graphiquement) dans son père...
Hors avec le positionnement absolu, cette règle n'a plus aucun sens !!!

Et ce n'est absolument pas un bug puisque tous les browsers fonctionnent de
la meme façon.

Donc, m'est d'avis que le problemen est insolvable sans passer par par une
detection de clip.
En gros faut que je verifie a la main si le souris est sur mon div rouge et
si non, il faut que je déclenche moi meme l'evenement du fond...
Le pire, c'est qu'à présent, ca me semble logique qu'il n'y a pas d'autre
solution.

Etienne

Etienne SOBOLE

08/12/2004 à 20:19

Donc, m'est d'avis que le problemen est insolvable sans passer par par une
detection de clip.
En gros faut que je verifie a la main si le souris est sur mon div rouge
et si non, il faut que je déclenche moi meme l'evenement du fond...

voila
http://extranet.webshaker.net/test/div/index4.php

bon si quelqu'un trouve mieux, je suis preneur quand meme...
Etienne

ASM

08/12/2004 à 22:44

bon si quelqu'un trouve mieux, je suis preneur quand meme...
Etienne

Salut,

Tu te doutes : je ne suis pas allé voir ...
Mais, comme dit par ailleurs,
il me semble
qu'un onmousedown sur le body
et
qu'un onmousedown sur une image translucide remplissant ton
div translucide en sur-inclusion
devrait fonctionner

en gros : avec une image ça marche
(enfin : devrait... car pas essayé pour ton pb)

--
*******************************************************
Stéphane MORIAUX et son vieux Mac
*******************************************************

Michel Claveau - abstraction méta-galactique non triviale en fuite perpétuelle.

09/12/2004 à 00:07

Essaie ça :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Extranet WebShaker</title>
<style type='text/css'>
#fond {position:absolute; left:0px; top:0px; width:500px; height:500px;
background-image:url(/test/div/fond.png); background-repeat:no-repeat;}
#div1 {position:absolute; left:100px; top:100px; width:250px; height:260px;
background-color:#ff0000; border:1px solid #000000}
#div2 {position:absolute; left:-101px; top:150px; width:500px; height:250px;
background-color:#c0c0c0; filter:alpha(opacityd); -moz-opacity:0.64;}
</style>
</head>
<body>

<div id='fond'>
<div id='div1'>bloc 1<div id='div2'></div></div>
</div>

<script type='text/javascript'>
var Ws_bNS = (navigator.vendor == ('Netscape6') || navigator.product = ('Gecko'));

function fct_fond(e)
{
alert(event.srcElement.id);
return false;
}

document.getElementById('fond').onmousedown = fct_fond;
</script>
</body>
</html>

Etienne SOBOLE

09/12/2004 à 08:19

Essaie ça :

Et non cela ne marche pas, car dans ton exemple, si tu cliques en bas (c'est
a dire sur le fond grisé) et bien ca te dit que tu as cliqué sur le div2,
alors que le résultat attendu c'est qu'il te dise que tu as cliqué sur le
fond...

On en revient au probleme de DOM et de la présentation graphique.
Le positionement absolu permet de placer des objets fils en dehors de la
zone géographique du père (ce qui est le cas de la zone grisée).
Et donc, on croit qu'on clique sur une zone de l'ecran, mais c'est faux, on
clique sur un objet, ca n'est pas le cas.

J'ai mis l'exemple de michel pour ceux qui veulent tester ici:
http://extranet.webshaker.net/test/div/index5.php

Etienne

Etienne SOBOLE

09/12/2004 à 08:22

"ASM" a écrit dans le message de news:

Tu te doutes : je ne suis pas allé voir ...

Ben non me doute pô ;)

Mais, comme dit par ailleurs, il me semble
qu'un onmousedown sur le body et
qu'un onmousedown sur une image translucide remplissant ton
div translucide en sur-inclusion
devrait fonctionner

Hum...
J'ai aussi testé cette solution, mais j'avoue que n'ayant pas bien compris
ou cela nous menait, je ne suis pas sur d'avoir bien placer les evènements.

Donc a priori, non ca ne marche pas...
Etienne

ASM

09/12/2004 à 14:00

"ASM" a écrit dans le message de news:

qu'un onmousedown sur le body et
qu'un onmousedown sur une image translucide remplissant ton
div translucide en sur-inclusion

Hum...
J'ai aussi testé cette solution,

Donc a priori, non ca ne marche pas...

Et à posteriori, maintenant que j'ai testé, en effet pas good !
(et je comprends mieux ta question)

Alors un évenement (mousedown?) sur body
et un autre sur le div (mouseover?)
Ça, ça marche (si on ne clique pas sur le div !)

--
*******************************************************
Stéphane MORIAUX et son vieux Mac
Aide Pages Perso (images & couleurs, formulaire, CHP)
http://perso.wanadoo.fr/stephane.moriaux/internet/
*******************************************************

ordre des evenements...

9 réponses

Veuillez sélectionner un problème