Jquery добавить щелчок, чтобы сдвинуть панель вверх?

У меня есть следующая панель слайдов, которую я собрал, используя учебные пособия и т. Д.

$(document).ready(function() {

$(".dropdown dt a").click(function() {
    $(".dropdown dd #panel").slideDown(150);
});

$(".dropdown dd #panel a").click(function() {

    $(".dropdown dd #panel").slideUp(150);

});

var myTimeout = null; 
$(".dropdown").bind("mouseleave", function() { 
    myTimeout = window.setTimeout(function() { 
         $(".dropdown dd #panel").slideUp(150); // <-- 1000ms  
    }, 1000);$('.dropdown dt a').removeClass('active'); 
}); 

$(".dropdown dd #panel").bind("mouseenter",function() { 
    window.clearTimeout(myTimeout); 
}); 

});

Однако я не могу понять, как щелкнуть, чтобы открыть панель.

В настоящее время вы щелкаете, и панель скользит вниз, вы входите в панель и выходите, и она снова скользит вверх.

Я хочу добавить, что после того, как вы нажали, чтобы показать панель, вы также можете нажать, чтобы закрыть ее?

Таким образом, у вас есть два способа закрыть его: отодвинуть мышь или снова нажать кнопку. Возможно, добавление активного класса, чтобы у меня была стрелка или что-то, что менялось, чтобы открыть, а затем закрыть?

Кто-нибудь поможет мне добавить функцию резервного копирования по щелчку?

Большое спасибо, если сможете :)

Thanks guys.

Пытался добавить ваш код, Брайан, но мне удалось его полностью сломать, я явно не поместил его в нужное место :(

изменить

Добавление совета Брайана...

$(document).ready(function() {



$(".dropdown dt a").click(function(){
    if($(".dropdown dd #panel").hasclass('open'){
        $(".dropdown dd #panel").slideDown(150).addClass('open');
    } else {
       $(".dropdown dd #panel").slideUp(150).removeClass('open');
    }
});         


$(".dropdown dd #panel a").click(function() {
    $(".dropdown dd #panel").slideUp(150).removeClass('open');;
});

var myTimeout = null; 
$(".dropdown").bind("mouseleave", function() { 
    myTimeout = window.setTimeout(function() { 
         $(".dropdown dd #panel").slideUp(150); // <-- 1000ms  
    }, 1000);$('.dropdown dt a').removeClass('active'); 
}); 

$(".dropdown dd #panel").bind("mouseenter",function() { 
    window.clearTimeout(myTimeout); 
}); 

});