Menu animation chopped when implementing .stop() feature.

Menu animation chopped when implementing .stop() feature.

Hey everyone, I've only been using jQuery for about a month now, so my apologies if this seems rather n00bish. 

I'm in the process of creating an animated drop down menu for a website using slide animations.  I added the .stop() command when the mouse leaves the drop down while its animating.  Everything works fine, but the next time you mouse over, the menu animation doesn't expand all the way.  It freezes at the point the last .stop() command was issued.  Is there something I'm missing in using the stop command?

Thanks in advanced.

  1. $("#menu_hover").mouseenter(function () {
  2.    if (menuStart == false && menuFinish == false){   
  3.      menuDown();
  4.    }
  5.    else{
  6.    }
  7. });
  8. $("#sub_menu").mouseleave(function () {
  9.   if (menuStart == true && menuFinish == true){   
  10.      menuUp();
  11.   }
  12.   else if(menuStart == true && menuFinish == false){
  13.    $("#sub_menu").stop(true, false);
  14.    $("#sub_menu").css("display","none");
  15.    menuStart = false;
  16.   }
  17.   else{;
  18.   }
  19. });
  20. //***********************
  21. function menuDown(){
  22.       menuStart = true;
  23.       $("#sub_menu").slideDown("slow", function(){
  24.              menuFinish = true;
  25.              
  26.         });
  27.    }
  28.    function menuUp(){
  29.       menuFinish = false;
  30.       $("#sub_menu").slideUp("slow", function(){
  31.              menuStart = false;
  32.         });
  33.    }