El método slideDown() en jQuery se usa para verificar la visibilidad de los elementos seleccionados o para mostrar los elementos ocultos. Funciona sobre dos tipos de elementos ocultos:
- Elementos ocultos usando métodos jQuery.
- Elementos ocultos usando display: ninguno en CSS.
Sintaxis:
$(selector).slideDown( speed, easing, callback )
Parámetros: este método acepta tres parámetros, como se mencionó anteriormente y se describe a continuación:
- Velocidad: es un parámetro opcional y se usa para especificar la velocidad del efecto de desvanecimiento. El valor predeterminado de velocidad es 400 milisegundos. Los posibles valores de la velocidad son:
- milisegundos
- «lento»
- «rápido»
- Easing: es un parámetro opcional y se usa para especificar la velocidad del elemento en diferentes puntos de la animación. El valor predeterminado de aceleración es «swing». Los posibles valores de la aceleración son:
- «ritmo»
- «lineal»
- devolución de llamada: es un parámetro opcional. La función de devolución de llamada se ejecuta después de que se completa el método slideDown().
El siguiente ejemplo ilustra el método slideDown() en jQuery:
Ejemplo: Este ejemplo muestra el elemento oculto usando el método slideDown().
html
<!DOCTYPE html>
<html>
<head>
<title>
jQuery slideDown() Method
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- Script to illustrate slideDown() method -->
<script>
$(document).ready(function() {
$(".geek").click(function() {
$("h1").slideDown();
});
});
</script>
</head>
<body>
<!-- hide element using CSS -->
<h1 style = "display:none" >
GeeksforGeeks
</h1>
<button class="geek">
Click on button to slide down
</button>
</body>
</html>
Salida: Antes de hacer clic en el botón:
Después de hacer clic en el botón:
