OnMouseOut sur un div

**DevilYann** · 13/03/2010, 00h31

Bonjour à tous

Je fais un OnMouseOver sur un div mon_div qui affiche un bloc, puis un OnMouseOut pour fermer ce bloc.
Or le div mon_div contient une image, un titre et un autre div.

Le OnMouseOut est alors déclanché sur chaque sortie des éléments de mon_div...

Comment faire pour ne le déclencher qu'une seule fois, à la vrai sortie de mon_div et non pas de chaque élément de celui-ci ?

Merci d'avance

**nsanabi** · 13/03/2010, 02h57

montre nous du code

**SpaceFrog** · 13/03/2010, 09h06

mets l'action du mousout de la div principale dans un setTimeout que tu annulera sur le mouseover des divs enfants

**DevilYann** · 13/03/2010, 09h45

Envoyé par SpaceFrog

mets l'action du mousout de la div principale dans un setTimeout que tu annulera sur le mouseover des divs enfants

T'aurais pas un tout petit exemple basique illustrant ta solution please ?...

**SpaceFrog** · 13/03/2010, 10h11

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
<style type="text/css">
html, body {height:100%
			width:100%;}
#foo { height:300px;
       width:300px;
       line-height:0;
       font-size:0;
       background-color:red;}
#bar { position:relative;
       height:100px;
       width:100px;
       margin: 0 auto 0 auto;
       background-color:green;
       top:100px;      
       }
 
</style>
<script type="text/javascript">
var gone
function leave(){
gone=setTimeout(function(){alert('sorti');},10)
}
</script>
 
</head>
 
<body>
<div id ="foo" onmouseout="leave()" onmouseover="clearTimeout(gone)">
	<div id="bar" onmouseover="clearTimeout(gone)"></div>
</div>	
</body>
 
</html>

**DevilYann** · 13/03/2010, 11h16

Merci bien pour l'exemple

Mais va falloir que je trouve une autre solution, car mon div contient une multitude d'éléments, et je fais cette opération sur 6 div de la page.

Donc cela alourdirait le code HTML...

**SpaceFrog** · 13/03/2010, 12h45

heu non suffit d'appeler une seule et même fonction depuis chaque div ..

**DevilYann** · 13/03/2010, 12h52

Envoyé par SpaceFrog

heu non suffit d'appeler une seule et même fonction depuis chaque div ..

J'ai 6 div sur lesquels faut que je mette

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onmouseout="leave()" onmouseover="clearTimeout(gone)"

A l'intérieur de chaque div, il va y avoir environ 5 éléments (une image, un titre, 2 ou 3 divs). Donc chaque élément va recevoir le code suivant

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onmouseover="clearTimeout(gone)"

Donc cela fait bcp de onmouseover / onmouseout sur le code pour un simple effet d'affichage que je voulais faire non ?

**SpaceFrog** · 13/03/2010, 13h26

ha il ne faut pas trop de onmouseover ni de onmouseout ?
Si le d'avoir à l'ecrire dans le code te dérange, tu peux l'appliquer dynamiquement avec js et encore plus simplement avec jquery

**DevilYann** · 13/03/2010, 13h40

Envoyé par SpaceFrog

ha il ne faut pas trop de onmouseover ni de onmouseout ?
Si le d'avoir à l'ecrire dans le code te dérange, tu peux l'appliquer dynamiquement avec js et encore plus simplement avec jquery

Disons que je n'aime pas trop surcharger le code HTML. Mais en effet je peux le faire dynamiquement, j'utiliserai pour cela prototype

OnMouseOut sur un div

JavaScript

Discussions similaires

Partager

Partager