jQuery slideDown ()
The jQuery slideDown() method is used to create a sliding-down animation on
elements, making them visible by gradually increasing their
height.
It’s commonly used to reveal hidden content with a smooth animation
effect.
Syntax
$(selector).slideDown(speed, callback);
- speed (Optional):specifies the speed of the slide-down animation.Can be slow, fast, or a time in milliseconds (e.g., 400).
- callback (Optional):A function to be executed after the slide-down animation completes.
<!DOCTYPE html>
<html>
<head>
<title>jQuery slideDown() Example</title>
<style>
#content {
display: none;
background-color: lightyellow;
padding: 20px;
border: 1px solid;
margin-top: 10px;
}
</style>
</head>
<body>
<button id="showButton">Show Content</button>
<div id="content">
<p>This is the hidden content that slides down when you
click the button!</p>
</div>
<script>
$(document).ready(function(){
$("#showButton").click(function(){
$("#content").slideDown("slow");
});
});
</script>
</body>
</html>
