jquery prevent loop

i have a hover slide down panel which needs a delay when mouse leave. Like i have it now, hovering the trigger will result in multiple loops, so the panel goes crazy up & down. Here is the code:

 $(document).ready(function(){
(function(){
  var trigger = $('li.HotelPaneltrigger');
  var panel = trigger.find('.panel').hide();
    trigger.mouseenter(function(){panel.slideDown('slow');}).mouseleave开发者_如何转开发(function(){panel.slideUp('slow');});
 })();
});

I tried this without success: $(this).mouseleave(function () {

$(this).delay('500')panel.slideUp('slow');

---

I'm not exactly sure if I get you right, but I think invoking .stop() will do it for you.

panel.stop(true, true).slideDown('slow');

and

panel.stop(true, true).delay(500).slideUp('slow');

Reference: .stop()

---

Adding a .stop(true,true) before your slideDown and slideUp event should solve your problem, off the top of my head.