CODEWITHSUNDEEP
jquery
Elliott
Elliott

Reputation: 3864

jquery clear animation queue

I have the code below, which works fine it can be viewed for an example. Once the user hovers over one menu, you can then not hover over it again unless the page is refreshed. I have a feeling its something to do with my queue and I have tried .stop() but doesnt seem to work.

<script type="text/javascript">
    $(document).ready(function() 
     {


        $('li').hover(function() 
        { 

                   $(this).children("p.subtext").stop().slideDown();            




            }, 

                function() 
                { 

                 $(this).children("p.subtext").stop().animate({height:'0px'},{queue:false, duration:600, easing: 'easeOutBounce'}) 

        }); 





    }); 
    </script>

Cheers

Upvotes: 1

Views: 10689

Answers (1)

Nick Craver
Nick Craver

Reputation: 630389

In this case, use .stop(true, true)

This first parameter in stop instructs it to clear the queue, see here for more info on .stop()

Edit, for your queue issue:

$('li').hover(function() { 
  $(this).children("p.subtext").slideDown();            
}, function() { 
  $(this).children("p.subtext")
         .animate({height:'toggle'},{duration:600, easing: 'easeOutBounce'});
});

Upvotes: 11

Related Questions