"How to Make a Smooth Animated Menu with jQuery" by Zach Dunn

Zach Dunn from buildinternet.com shared his jquery menu.

http://buildinternet.com/2009/01/how-to-make-a-smooth-animated-menu-with-jquery/
It does not gracefully degrade with Javascript unabled, but it is a good tutorial. He guide us line by line with detailed comment.
.stop() is used for avoiding a broken accordion effect. Mouseover, mouseout
and normal chain is used.

Thanks Zach.


  $(document).ready(function(){

    //When mouse rolls over
    $("li").mouseover(function(){
        $(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

    //When mouse is removed
    $("li").mouseout(function(){
        $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

});


  $(document).ready(function(){

    //When mouse rolls over
    $("li").mouseover(function(){
        $(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

    //When mouse is removed
    $("li").mouseout(function(){
        $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

});