fonction animate pour menu deroulant

**willyg28** · 06/04/2012, 22h02

voici un petit de code que j ai teste pour mettre en place un menu deroulant :

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
 
<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#indicateur").mouseover(function()
{
$("#menu").animate({height:"160"},300);
});
$("#menu").mouseout(function()
{
$("#menu").animate({height:"20"},300);
});
});
</script>
<body>
<div id="menu" style="border:1px black solid;height:20;overflow:hidden">
  <div id="indicateur"><label>indicateur</label></div>
  <div id="menubas">
           <div id="menubas1">monmenuA</div>
            <div id="menubas2">monmenuB</div>
  </div>
</div>
</body>
</html>

mon probleme le voici :
le calque "menu" se deroule bien mais des que je bouge il remonte meme si je reste à l interieur de celui ci ...je ne comprend pas..
pouvez vous m expliquer pourquoi ?

merci d avance
willy

**NoSmoking** · 07/04/2012, 15h52

Bonjour,
problème maintes fois croisé sur le forum, voir du coté de .mouseleave()

**willyg28** · 09/04/2012, 15h36

merci de ta réponse, en effet j ai essaye avec mouseleave et ca fonctionne .
Mais pourquoi alors le mouseout ne fonctionne pas ?

willy

**Bovino** · 10/04/2012, 08h06

Si tu as par exemple une structure

Code html :

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

1
2
3
<div>
    <span>...</span>
</div>

Si tu poses un gestionnaire mouseover / mouseout sur la balise <div>, au moment où tu passes sur la balise <span>, cela provoque le mouseout. Cela peut être éviter (nativement dans certains navigateurs, en le programmant pour d'autres) avec un événement mouleave qui ne propage pas l'événement.

**willyg28** · 11/04/2012, 09h09

merci bovino pour ta reponse,
je comprend un peu mieux le principe..

bonne journée a tous

willy

fonction animate pour menu deroulant

jQuery

Vue hybride

Discussions similaires

Partager

Partager