Evenement Hover et animate - jQuery 1.6.1 [Résolu]

[SpYd3r]

Bonjour,

j'utilise jQuery depuis peu et j'ai un petit problème sur un script assez simple que j'ai codé. Celui-ci permet de faire "monter" puis "descendre" la description d'un article lorsque l'utilisateur passe sa souris dessus (hover). Voici le script en question :

Code :

1
2
3
4
5
6
 
jQuery('.zone').hover(function(){
		$('.effet').animate({top:80},500);
	},function(){
		$('.effet').animate({top:105},500);
	});

Biensur il se trouve dans un : $(document).ready(). Mais si l'on survole assez vite l'image plusieurs fois d'affilé, l'action va s'exécuter autant de fois que l’événement s'est déclenché. J'aimerais limiter cet effet.

Si je ne me suis pas bien fait comprendre, rendez-vous ici : http://www.fildepices.com/index.php et tentez un Parkinson avec votre souris sur les images encadrées en noire. Je pense que vous verrez le souci.

Merci d'avance.

[danielhagnoul]

Bonsoir

Je vous suggère d'essayer :

Code :

1
2
3
4
5
6
7
8
jQuery('.zone').hover(
	function(){
		$('.effet').stop(true, true).animate({top:80}, 500);
	},
	function(){
		$('.effet').stop(true, true).animate({top:105}, 500);
	}
);

stop() : http://api.jquery.com/stop/

Si vous voulez ralentir le rythme, on peut ajouter un délai d'attente :

Code :

1
2
3
4
5
6
7
8
jQuery('.zone').hover(
	function(){
		$('.effet').stop(true, true).delay(1000).animate({top:80}, 500);
	},
	function(){
		$('.effet').stop(true, true).delay(1000).animate({top:105}, 500);
	}
);

[SpYd3r]

Merci pour ta réponse .stop() m'a permis de corriger ce "bug".