Bonjour!

Je commence un site pour un ami. Il voulait un beau menu glissant. Je me suis donc intéressé au javascript et je suis tombé sur le framework jQuery, juste ce qu'il me fallait!

Ca marche très bien à l'exception d'une chose. J'aimerais que le sous-menu "remonte" avec un effet glissant quand la souris quitte le sous-menu. Pour le moment, je dois absolument repasser la souris sur l'élement du menu correspondant. (voici le lien, on comprend toujours mieux un problème quand on le voit! http://www.crea-consult.com/ChristianWebsite/PHP/home.php )

J'ai donc consulté la doc de jQuery (http://api.jquery.com/category/events/). Après de multiples tentatives de tout genre avec les différents events, ma dernière idée était d'utiliser mouseout sur le div "dans lequel" se trouve mon element du menu (Chaque élement du menu se trouve dans un div - J'avoue que c'est pas très propre mais si je ne fait pas ça, alors projects se décale à gauche quand le sous-menu se déroule) mais ça ne marche pas. Dès que la souris quitte l'element du menu, le sous-menu remonte directement. J'ai essayé de fixer une hauteur au div, mais l'effet est le même...

Voici mon code:

$(document).ready(function () 
		{
    		$('a#menu_headProjects').mouseover(function () {
			$('ul#menu_bodyProjects').slideDown('medium');
    		});
    		$('div#menuProjects').mouseout(function () {
    			$('ul#menu_bodyProjects').slideUp('medium');
        		});
    		
    		$('a#menu_headProfile').mouseover(function () {
    			$('ul#menu_bodyProfile').slideToggle('medium');
        	});
    		$('a#menu_headLanguage').mouseover(function () {
    			$('ul#menu_bodyLanguage').slideToggle('medium');
        	});
		});

Merci pour votre aide!

EDIT:
Alors finalement j'ai trouvé comment faire!
Grâce à un mouseleave au lieu d'un mouseout sur le div (ou sur chaque element avec un display:block) de chaque element du menu qui contient des sous-éléments.

Voici le code pour un élement du menu:

$(function () 
		{
    		$('a#menu_headProjects').mouseover(function () {
			$('ul#menu_bodyProjects').slideDown('medium');
    		});
    		$('#menuProjects').mouseleave(function () {
    			$('ul#menu_bodyProjects').slideUp('medium');
        		});
                });