我怎樣才能打開一個div關閉所有其他divs？

Question

我目前在我的網站頂部有2個面板（div's）。當你點擊一個鏈接時，它會下拉麪板。當你點擊另一個鏈接時，我想讓它向上滑動任何打開的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是否一旦點擊就打開，但如果你點擊另一個，它會打開它，而另一個關閉。

的是我想達到一個很好的例子是here：

點擊鏈接在頂部。

Answer 1

想要在閉幕動畫結束後開始動畫。這可以通過提供一個回調的第一個動畫來完成：

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

Answer 2

類是註定不會是唯一的，他們的意思是......嗯，在某種程度上引用。

換句話說，將兩個類命名爲相同（僅差別爲一個字母）會打敗課程的目的。你通過給他們一個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> 

現在，你不必有兩個相同的jquery功能，只有

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