jQuery-Keep slidedown DIV отображается, если наведите курсор на него

Question

У меня есть ссылка (BTN-SLIDE), которая при нажатии (а не при наведении) скользит вниз по другому DIV (называемому PANEL), что-то вроде выпадающего меню.

Я хочу, чтобы убедиться, что выпадающий DIV гаснет, когда: а) мыши покидает ссылку б) мышь покидает выпадающий DIV

Но я также хочу раскрывающийся DIV остаться видимым в то время как мыши над ним.

Это код, который у меня есть. Проблема в том, что когда я нажимаю, чтобы открыть раскрывающийся список DIV (#panel), и оставьте ссылку (.btn-slide) без наведения на панель #panel, тогда #panel никогда не будет закрыт.

С другой стороны, если я установил #panel для закрытия по ссылке на ссылку, то #panel закроется, даже если я навешиваю его.

Любое решение? Благодаря!

<a class="btn-slide" href="#”>Click here to open Panel</a>  
<div id="panel"><p>ahsjdhkashdkasjhd</p></div> 

$(".btn-slide").click(function(){ 
    $("#panel").slideDown(500); 
}); 

    $("#panel").mouseleave(function(){ 
     $("#panel").slideUp(500); 
}); 

Answer 1

Вы можете обернуть оба элемента в родительский элемент и получить триггер mouseleave. http://jsfiddle.net/UCrQF/