Jquery 我如何才能使一个div的开始关闭所有其他div？

我目前在我的网站顶部有两个面板（div）。当你点击一个链接时，它会从面板上掉下来。当你点击另一个链接时，我希望它向上滑动任何打开的div，然后一旦它向上滑动，打开被点击的div

我目前有：

$(document).ready(function(){
$(".btnSlideL").click(function(){
    $("#clientLogin").slideUp('fast');
  $("#languages").slideToggle("fast");
  $(this).toggleClass("active");
});
});

$(document).ready(function(){
$(".btnSlideC").click(function(){
  $("#languages").slideUp('fast');
  $("#clientLogin").slideToggle("fast");
  $(this).toggleClass("active");
});

}))

和HTML：

<div id="languages" class="topPanel">
    <div class="topPanelCont">
        languages
    </div>
</div>

<div id="clientLogin" class="topPanel">
    <div class="topPanelCont">
        client login
    </div>
</div>

<div id="container">
    <div id="containerCont">
        <div id="headerTop">
            <a href="#" title="#" class="btnSlideL">Languages</a>
            <a href="#" title="#" class="btnSlideC">Client Login</a>
        </div>

语言
客户端登录

但我觉得这有点冗长

发生的是，Div，单击后打开，但是如果单击另一个，它会在顶部打开，而另一个在下面关闭

我想要实现的一个很好的例子是：

---

单击顶部的链接。

您希望在结束动画后开始动画。这可以通过提供对第一个动画的回调来实现：

$("#clientLogin").slideUp('fast', function() { 
  $("#languages").slideToggle("fast"); 
});

---

类并不意味着是唯一的，它们意味着在某种程度上是引用

换言之，将两个类命名为相同的（唯一的区别是一个字母）违背了类的目的。你通过给他们一个id使他们独一无二

因此，在代码中，将带前缀的字母从类名中取出并放入id中

    <div id="headerTop">
        <a href="#" title="#" class="btnSlideL">Languages</a>
        <a href="#" title="#" class="btnSlideC">Client Login</a>
    </div>

    <div id="headerTop">
        <a href="#" title="#" id="L" class="btnSlide">Languages</a>
        <a href="#" title="#" id="C" class="btnSlide">Client Login</a>
    </div>

$(document).ready(function(){
$(".btnSlide").click(function(){
  $(".topPanel").slideUp('fast');
  $(this).toggleClass("active");
});
$("#L").click(function() {
  $('#languages').slideDown("fast");
});
$("#").click(function() {
  $('#clientlogin').slideDown("fast");
});