jquery alternar slideUp/slideDown

Question

Tengo un elemento div # y si se hace clic en él, div # options slideDown(). Si se vuelve a hacer clic, las opciones div # deben deslizarse hacia arriba(); ¿Cómo puedo probar si las opciones ya están caídas o no? Sé que podría almacenar en una variable y alternar su valor cada vez que se hace clic en div # items, pero ¿qué ocurre si #choices ha sido deslizado por otros medios?

Answer 1

Uso .slideToggle()

Answer 2

Como Marimuthu's answer puntos out, se puede utilizar slideToggle() para deslizarse hacia arriba si el div ya está abierto, o hacia abajo si está cerrado.

También puede consultar la propiedad display para averiguar si actualmente está visible o no. De los documentos jQuery para slideUp().

Una vez que la altura llega a 0, la propiedad de estilo de visualización se establece en none para garantizar que el elemento ya no afecte al diseño de la página.

Sabiendo esto, usted puede comprobar para ver si se ajusta a "ninguno":

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

Answer 3

Prueba esto -

HTML:

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

JQUERY GUIÓN:

$('.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'); 
     } 
    }); 
});