jquery issue, disable on mouseenter queue

Question

When you mouseenter .li_group class it does a slide down effect on 1 single <li> tag, everything goes smoothly, but during the delay if you take your mouse off and on .li_group it "queues" the effect and slides the li down, delay, slides it down again etc etc... I have tried every way i can think of, even stop(); but it still does it...

the reason i use mouseenter instead of hover, is because it works better for ul / li list

$(".li_group").live('mouseenter',function(){
        var id = "#ec1";  
        $(id).slideDown();                               
    }).live('mouseleave',function(){
     if (jQuery.support.cssFloat==true || getInternetExplorerVersion() > 7)  {      //ie < 8 endless up/down on close
        var id = "#ec1";  
         $(id).delay(5000).slideUp('fast'); 
       }
    });

Answer 1

When you used .stop() did you also clear the queue and jump to end? For example,

$(".li_group")
    .live('mouseenter',function(){
        var id = "#ec1";  
        $(id).stop(true, true).slideDown();                               
    })
    .live('mouseleave',function(){
       //ie < 8 endless up/down on close
       if (jQuery.support.cssFloat==true || getInternetExplorerVersion() > 7)  {      
           var id = "#ec1";  
           $(id).stop(true, true).slideUp('fast'); 
       }
    });

I've taken the delay(5000) call out of there, as I take it that this was put in to prevent the problem you were getting. I'd also recommend using the tag name(s) in your selector too, to help those browsers that don't have document.getElementsByClassName()