JQuery : mouseout sur deux éléments

Bonjour à tous,

Je suis en train de réaliser un script grâce à la librairie jQuery. Il s'agit d'un script simpliste qui, lorsque la souris passe sur un élément, affiche une DIV cachée. Lorsque la souris sort, la DIV s'efface. Voici la partie du code concernée par mon problème :

$('.bottom_internet').hover(function() {
		$('#bottom_internet').fadeIn(250);
	});
	$('.bottom_internet').mouseout(function() {
		$('#bottom_internet').fadeOut(250);
	});

Lorsqu'un un utilisateur passe sa souris sur la classe .box_internet, la div #box_internet s'ouvre. Lorsque la souris quitte .box_internet, #box_internet se ferme. Seulement j'aimerais que #box_internet se ferme seulement et uniquement si la souris n'est pas non plus sur cet élément. Autrement dit, fermer la div si la souris quitte .box._internet mais en s'assurant qu'elle ne soit pas sur #box_internet.

Savez-vous comment faire ?
Merci d'avance

Bonjour,

Le plus simple dans ton cas serait d'utiliser un élément qui englobera .box_internet et #box_internet.

Ce faisant, grâce au bubbling des évènements en javascript, tu n'auras qu'à vérifier le mouseon et le mouseout sur ce nouvel élément.

Merci d'avoir répondu mais le soucis est que .box_internet est en fait une liste à puce, du genre :

<li class="box_internet"><a href="">Texte ...</a></li>
<li class="box_telephone"><a href="">Texte ...</a></li>
<li class="box_fax"><a href="">Texte ...</a></li>

Chaque liste renvoi vers une élément devant s'afficher au passage de la souris, je ne peux donc pas englober d'une div une liste et la div correspondante (celle qui soit s'afficher). A moins, évidemment, de spliter mon <ul> mais ce n'est pas trop propre

Merci d'avance