Javascript, événements OnMouseOver/OnMouseOut/Onclick

Bonjour la communauté,

Je suis face à un problème avec les valeurs OnMouseOver/OnMouseOut/Onclick en Javascript.

Je veux :
- Afficher une div cachée avec OnMouseOver (jusque là pas de problème ça marche, je l'appelle div1 pour l'exemple)
- Faire disparaître cette div1 avec OnMouseOut (ça marche)
- Laisser cette div1 apparente avec OnClick (ça marche aussi)
- Seulement j'ai d'autres div cachées dans la page et je voudrais que la div1 disparaisse lorsque OnMouseOver survol un autre élément comportant une div cachée.

<script type="text/javascript">
	div = {
		show: function(elem) {
			document.getElementById(elem).style.visibility = 'visible';
		},
		hide: function(elem) {
			document.getElementById(elem).style.visibility = 'hidden';
		}
	}
</script>

Quel code javascript dois-je ajouter pour l'effet : "Div cliquée reste apparente jusqu'au clic sur une autre Div ou jusqu'au survol d'une autre div" ?

Mon résultat actuel est que ma div cliquée reste apparente mais en superposition avec toutes les autres div cliquées. En gros, je voudrais appliquer "Hidden" à la dernière Div cliquée à chaque nouveau "OnClick" ou "OnMouseOver".

Par ailleurs, s'il y a un code simplifié en Jquery ou autre pour réaliser la même chose je suis preneur.

Enfin, je signale que tous mes Onclick affichent les Div à un même emplacement de la page (d'où la superposition fâcheuse...)

Merci d'avance pour vos idées.
Modifié par Squall1982 (27 Dec 2010 - 19:25)

Bonjour,

Tu pourrais peut être faire un reset sur toutes tes autres div avant de mettre sur la div en question visibility=visible.
1/ sur le onMouseOver ou onClick tu appel une fonction
2/ cette fonction tu mets en hidden toutes les div qui font partie des div que tu veux manipuler (récupérable facilement si elles ont une classe identique)
3/ tu met la div qui appel l'évènement en visible

Cela répond t'il à ton besoin ?

Très bien. Ça répond à ce que je cherche à faire. Par contre, comment faire pour appliquer le reset dont tu parles. Le reste du code fontionne parfaitement avec hidden et visible. Manque seulement le reset. Merci encore.

Le reset c'est assez simple, tu récupère toutes tes div et tu les mets en hidden.
Tu utilise un frameworks particulier (librairie type jquery, mootools...) ?

Si c'est sans, tu peux faire un getElementsByTagName('div'), vérifier que ce sont bien les divs que tu utilise en regardant la valeur du className et enfin mettre leur visibility en hidden.
(je te dis ça de mémoire, à vérifier )