Efeitos jQuery - Deslizando
Os métodos slide do jQuery deslizam os elementos para cima e para baixo.
Clique para deslizar para baixo/para cima no painel
Como o tempo é valioso, oferecemos aprendizado rápido e fácil.
Na W3Schools, você pode estudar tudo o que precisa aprender, em um formato acessível e prático.
Exemplos
Demonstra o método jQuery slideDown().
Demonstra o método jQuery slideUp().
Demonstra o método jQuery slideToggle().
Métodos deslizantes do jQuery
Com jQuery você pode criar um efeito deslizante nos elementos.
jQuery tem os seguintes métodos de slide:
slideDown()slideUp()slideToggle()
Método jQuery slideDown()
O método jQuery slideDown()é usado para deslizar para baixo um elemento.
Sintaxe:
$(selector).slideDown(speed,callback);
O parâmetro opcional de velocidade especifica a duração do efeito. Pode assumir os seguintes valores: "lento", "rápido" ou milissegundos.
O parâmetro de retorno de chamada opcional é uma função a ser executada após a conclusão do deslizamento.
O exemplo a seguir demonstra o slideDown()método:
Exemplo
$("#flip").click(function(){
$("#panel").slideDown();
});
Método jQuery slideUp()
O método jQuery slideUp()é usado para deslizar um elemento para cima.
Sintaxe:
$(selector).slideUp(speed,callback);
O parâmetro opcional de velocidade especifica a duração do efeito. Pode assumir os seguintes valores: "lento", "rápido" ou milissegundos.
O parâmetro de retorno de chamada opcional é uma função a ser executada após a conclusão do deslizamento.
O exemplo a seguir demonstra o slideUp()método:
Exemplo
$("#flip").click(function(){
$("#panel").slideUp();
});
Método jQuery slideToggle()
O método jQuery slideToggle()alterna entre os
métodos slideDown()e .slideUp()
Se os elementos foram deslizados para baixo, slideToggle()irá deslizá-los para cima.
Se os elementos foram deslizados para cima, slideToggle()os deslizará para baixo.
$(selector).slideToggle(speed,callback);
O parâmetro de velocidade opcional pode assumir os seguintes valores: "lento", "rápido", milissegundos.
O parâmetro de retorno de chamada opcional é uma função a ser executada após a conclusão do deslizamento.
O exemplo a seguir demonstra o slideToggle()método:
Exemplo
$("#flip").click(function(){
$("#panel").slideToggle();
});
Exercícios de jQuery
Referência de efeitos jQuery
Para uma visão geral completa de todos os efeitos do jQuery, acesse nossa Referência de Efeitos do jQuery .