JQuery- Garder hover() sur plusieurs élements

Fermé
Riless Messages postés 41 Date d'inscription mardi 28 octobre 2008 Statut Membre Dernière intervention 24 juillet 2015 - 9 août 2011 à 23:21
salut à tous,
Voila, je veut réaliser un effet de fadeIn/fadeOut sur une DIV contenant d'autres éléments comme suite :

<div class="mainbox">
	<div class="boxes">
		<div class="box1"></div>
		<div class="box2"></div>
		<div class="box3"></div>
		etc...
	</div>
</div>


L'effet que je veut réaliser c'est que lorsque je pointe le curseur sur "mainbox", l'élément "boxes" apparait avec la fonction :

$('.mainbox').hover(function(){
	$(this).find('.boxes').stop().animate({opacity: '1'}, 600)});


Et quand je sort le curseur "mouseout()" elle fait l'inverse.
ça c'est fait, mais le probléme que j'ai rencontré, c'est que quand je met le curseur sur "boxes" ou l'un de ses éléments enfant (qui se trouve tous dans "mainbox") l'élément disparait aussi.

Alors ma question est la suivante: comment pourrais-je garder "boxes" visible même si le curseur se positionne sur l'un des déscendant de "mainbox"

merci d'avance pour toute vos répenses