SlideToggle erste und letzte div schalten zwischen

Question

Ich habe jquery verwendet, um einige Registerkarten zu erstellen. Hier ist mein grundlegender Code.

JSFiddle

Ich will es so eingestellt, dass die anfängliche Öffnung der Registerkarte Inhalt ist ein slideToggle aber dann zwischen den Tabs zu bewegen ist ein Standard-Toggle dann, wenn der Benutzer das Element klickt die Elemente ich möchte es slideToggle schließen nochmal. Also zum Beispiel.

öffnen Tab 1 - SlideToggle, bewegen Tab 2 - Toggle, Tab 3 bewegen - Toggle, um Tab 2 bewegen - Toggle, Tab schließen 2 - slideToggle

Ist das möglich und wenn ja, wie kann ich erreichen, Dies. Ich habe versucht, das zu googeln, aber ich kann nicht die Antwort finden.

Vielen Dank im Voraus für jede Hilfe.

HTML

<div class="tab">Tab 1</div> 
<div class="tab">Tab 2</div> 
<div class="tab">Tab 3</div> 

<div class="lrgWork"> Tab Content 1</div> 
<div class="lrgWork"> Tab Content 2</div> 
<div class="lrgWork"> Tab Content 3</div> 

JS

$('.tab').click(function() { 
     var index = $(this).index(); 
     $('.lrgWork').eq(index).slideToggle().siblings('.lrgWork').hide(); 
    }); 

Answer 1

Wie wäre es

var currentTabOpen=0;//keeps track of what tab is open 
var tabOpen=false;//keeps track of whether a tab is opened 
$('.tab').click(function() { 
    var index=$(this).index(); 
    if(currentTabOpen==index||!tabOpen){//if we're either closing a tab, or opening one, 
     $('.lrgWork').eq(index).slideToggle();//use the slide animation 
     tabOpen=!tabOpen;//and now the tab is open if it was closed and vice versa 
    } 
    currentTabOpen=index;//make sure we're keeping track of the opened tab 
    $('.lrgWork').eq(index).show().siblings('.lrgWork').hide();//don't use the animation 
}); 

und sehen hier die JSFiddle arbeiten.