Gestion des évènements avec une superposition d'éléments

Bonsoir,

J'ai du mal à gérer un évènement dans des div imbriqués. Voici mon code (simplifié) :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<style>     #mainview { position:relative; margin:0; height:720px; overflow:hidden; }     #mainview #locations li { position:absolute; width:86px; height:43px; list-style-type:none; }     #mainview #locations li a { display:block; position:absolute; bottom:0px; left:-2px; width:90px; height:70px; outline:none; }     #mainview #barDesc { position:relative; top:600px; display:none; } </style>   <div id="mainview" onclick="document.getElementById('barDesc').style.display='none'"> <div id="locations"> <li><a href="javascript:document.getElementById('barDesc').style.display='block'"></a></li>'; </div> <div id="barDesc"></div> </div>

---

Donc j'ai ma vue principale "mainview" dans laquelle est contenue une barre d'infos "barDesc". Cette dernière est invisible, jusqu'à ce qu'on clique sur un label "locations". Puis on clique n'importe où sur la page pour faire disparaître la barre.
Le problème, c'est que je ne souhaite pas que la barre disparaisse si on clique dessus ! Ce qui est le cas, car le div se trouvant en-dessous capte toujours les évènements ! J'ai essayé d'ajouter des z-index sur la feuille de style, ça n'a rien changé.
Comment puis-je y remédier ?

Pourquoi ne pas faire ainsi tout simplement ?

Code:

---

1 2 3 4 5 6

<div id="mainview"> <div id="locations"> <li><a href="javascript:document.getElementById('barDesc').style.display='block'"></a></li> </div> <div id="barDesc"></div> </div>

---

Je dis ça parce que je vois pas pourquoi on cliquerait sur le premier div :aie:

Ben ça c'est pas résoudre un problème mais le supprimer 8O

Il faut cliquer sur le premier div pour faire disparaître le second (et il n'est pas question de faire autrement).

Mon message va faire tout le tour des forums on dirait :aie:

Pourquoi ne pas faire un switch directement sur ton li a ? C'est lui qui fait disparaitre et apparaitre le div.

http://www.developpez.net/forums/d46...r-masquer-div/

Ben non, je tiens vraiment à ce que ce soit mon div d'arrière-plan qui gère la disparition.

Mais c'est bon, j'ai trouvé une solution en écrivant une petite fonction javascript, après avoir appris que les divs conteneurs étaient appelés après les div imbriqués :D

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

var clickOnBar = false;   function hideBarDesc(obj) { if (obj.id == "barDesc") { clickOnBar = true; } else { if (clickOnBar == true) { clickOnBar = false; return false; } else { document.getElementById('barDesc').style.display='none'; } } }

---