2010-07-21 16 views
9

Ich habe ein div # Elemente und wenn es angeklickt wird dann div # Auswahl slideDown(). Wenn es erneut geklickt wird, sollten div # -Wahlen slideUp(); Wie kann ich testen, ob die Auswahl bereits gefallen ist oder nicht? Ich weiß, dass ich in einer Variable speichern und den Wert umschalten kann, wenn div # Elemente angeklickt wird, aber was ist, wenn #choices auf andere Weise heruntergerutscht wurde?jquery toggle slideUp/slideDown

Antwort

15

Verwenden .slideToggle()

+0

Wird nicht funktionieren, da er der Schieber die durch andere Elemente durchgeführt werden. –

+2

+1. @Kaaviar: Eigentlich sollte das gut genug funktionieren, weil 'slideToggle()' überprüfen wird, ob das Element momentan versteckt oder angezeigt wird. –

+0

wie Sie mit slideToggle rutschen oder rutschen? – Smash

6

Als Marimuthu's answer Punkte, können Sie slideToggle() aufbrauchen schieben, wenn das div bereits geöffnet ist, oder nach unten, wenn es geschlossen ist.

Sie können auch die display-Eigenschaft überprüfen, um herauszufinden, ob sie derzeit sichtbar ist oder nicht. Aus der jQuery-Dokumentation für slideUp().

Sobald die Höhe 0 erreicht, wird die Eigenschaft display style auf none gesetzt, um sicherzustellen, dass das Element das Layout der Seite nicht mehr beeinflusst.

Mit diesem Wissen können Sie überprüfen, um zu sehen, ob es wird auf "none":

var $choices = $('div#choices'); 
if ($choices.css("display") == "none") 
    $choices.slideDown(); 
else 
    $choices.slideUp(); 
0
diese

Versuchen -


HTML:

<a href="#demo" class="nav-toggle">Show</a> 
<div id="demo" style="display:none;"> 
<p>short info</p> 
</div> 


JQUERY SCRIPT:

$('.nav-toggle').click(function(){ 
    var content_id = $(this).attr('href');    
    var toggle_switch = $(this); 
    $(content_id).toggle(function(){ 
    if($(this).css('display')=='none'){ 
      toggle_switch.html('Show'); 
    }else{ 
     toggle_switch.html('Hide'); 
     } 
    }); 
});