Método slideToggle no jQuery
O próximo método -
slideToggle
funciona da seguinte forma: se o elemento estiver oculto, ele o mostra,
e se estiver visível, ele o oculta. A conveniência
deste método é que você pode atribuir essa ação
a um único botão, e não a dois, como foi nos
lições anteriores.
Vamos considerar o seguinte exemplo. Suponha que nosso código HTML seja assim:
<button id="toggle">click me</button>
<div id="elem">text...</div>
Há também CSS:
#elem {
padding: 10px;
width: 150px;
height: 150px;
border: 1px solid green;
margin-top: 10px;
}
Agora vamos escrever o código para que, ao clicar em um botão, o elemento seja ocultado e mostrado alternadamente:
$('#toggle').click(function() {
$('#elem').slideToggle(1000);
});
