Los últimos tutoriales de desarrollo web
 

jQuery - Efectos correderas


Los métodos de diapositivas jQuery se deslizan los elementos arriba y abajo.

Haga clic para deslizar hacia abajo / arriba el panel

Porque el tiempo es valioso, ofrecemos un aprendizaje rápido y fácil.

En w3ii, se puede estudiar todo lo necesario para aprender, en un formato accesible y práctico.


Ejemplos

jQuery slideDown()
Demuestra el jQuery slideDown() método.

jQuery slideUp()
Demuestra el jQuery slideUp() método.

jQuery slideToggle()
Demuestra el jQuery slideToggle() método.


Métodos jQuery deslizante

Con jQuery se puede crear un efecto de deslizamiento en los elementos.

jQuery tiene los siguientes métodos de diapositivas:

  • slideDown()
  • slideUp()
  • slideToggle()

jQuery slideDown() Método

El jQuery slideDown() método se utiliza para deslizarse por un elemento.

Sintaxis:

$(selector).slideDown(speed,callback);

El parámetro de velocidad opcional especifica la duración del efecto. Puede tomar los siguientes valores: "slow", "fast" , o milisegundos.

El parámetro callback opcional es una función a ejecutar después de que se complete el deslizamiento.

El siguiente ejemplo demuestra el slideDown() método:

Ejemplo

$("#flip").click(function(){
    $("#panel").slideDown();
});
Inténtalo tú mismo "

jQuery slideUp() Método

El jQuery slideUp() método se utiliza para deslizarse hacia arriba un elemento.

Sintaxis:

$(selector).slideUp(speed,callback);

El parámetro de velocidad opcional especifica la duración del efecto. Puede tomar los siguientes valores: "slow", "fast" , o milisegundos.

El parámetro callback opcional es una función a ejecutar después de que se complete el deslizamiento.

El siguiente ejemplo demuestra el slideUp() método:

Ejemplo

$("#flip").click(function(){
    $("#panel").slideUp();
});
Inténtalo tú mismo "

jQuery slideToggle() Método

El jQuery slideToggle() método alterna entre la slideDown() y slideUp() métodos.

Si los elementos se han deslizado hacia abajo, slideToggle() se deslizará hacia arriba.

Si los elementos se han deslizado hacia arriba, slideToggle() se deslizará hacia abajo.

$(selector).slideToggle(speed,callback);

El parámetro de velocidad opcional puede tomar los siguientes valores: "slow", "fast" , milisegundos.

El parámetro callback opcional es una función a ejecutar después de que se complete el deslizamiento.

El siguiente ejemplo demuestra el slideToggle() método:

Ejemplo

$("#flip").click(function(){
    $("#panel").slideToggle();
});
Inténtalo tú mismo "

Ponte a prueba con los ejercicios!

Ejercicio 1 » Ejercicio 2» Ejercicio 3 » Ejercicio 4»


jQuery Referencia de efectos

Para una visión completa de todos los efectos jQuery, por favor vaya a nuestra jQuery Efecto de referencia .