Question

Look at my codes here please : http://jsfiddle.net/FVcJz/7/

when we hover on the text, we see an animation.
if we hover mouse 5 times on the text, the box will be animated 5 times.
how to set a code which prevents 4 remained animations when the first animation is not finished yet ?!
I mean to have animation only when the animation in not in progress by the previous hover ..
so then, when we hover 5 times on the text, the animation will be ran 1 time only ( if the 4 hovers are before animation ending )

Answer 1

you can use the stop method..

$(function () {

$(".tt").hover(function(){

    $(".bb").stop().animate({width:'150px'}, 500);  

},function() {

    $(".bb").stop().animate({width:'100px'}, 500);  


});     
});

​