Hover menu et setTimeOut

Bonjour à tous,

Voila voila j'ai un souci en Prototype et je requiert votre aide, je vous explique.
J'ai un menu possédant un sous-menu, et ce que je veux faire c'est lorsqu'on effectue un hover sur sur le menu, qu'il y ait un temps d'attente d'environ 2 secondes et que le sous-menu s'affiche ensuite.

Voila ce que j'ai fait jusqu'à présent :
Structure Prototype :

Code:

---

1 2 3 4 5 6 7 8 9 10

$$('.menu').each(function(element){ element.observe('mouseover',function(){ window.setTimeout(function() { element.addClassName('over'); },1000); }) element.observe('mouseout',function(){ element.removeClassName('over'); }); });

---

Structure HTML :

Code:

---

1 2 3 4

<div class="menu"> <div class="sous-menu"></div> </div> // Quand le menu a une classe over, le sous-menu s'affiche.

---

Le problème, c'est que ds que je quitte le bouton du menu pour accéder au sous-menu, le hover s'enlève et se remet, et du coup lance un nouvel évènement mouseover avec 1 seconde d'attente...