---
title: "what the role of slideDown method in JQuery?"  
description: "what the role of slideDown method in JQuery?"  
author: "Ethan Karla"  
published: 2021-07-28  
canonical: https://answers.mindstick.com/qa/93796/what-the-role-of-slidedown-method-in-jquery  
category: "web application"  
tags: ["web development", "web application development"]  
reading_time: 2 minutes  

---

# what the role of slideDown method in JQuery?

what the [role](https://yourviews.mindstick.com/view/85446/national-doctor-s-day-recognizing-the-indispensable-role-of-doctors-in-one-s-life) of slideDown [method in JQuery](https://www.mindstick.com/forum/156670/has-method-in-jquery)?

## Answers

### Answer by Ravi Vishwakarma

**jQuery slideDown() [Method](https://www.mindstick.com/articles/23411/the-most-effective-method-to-find-the-perfect-small-business-phone-system-for-your-business)**

If an element is to be viewed in slide down order, we do it using slideDown method of jQuery.Syntax:

```
Syntax
 $(selector).slideDown(speed)
 $(selector).slideDown(speed,callback)
```

> Speed and callback is an optional parameter. Speed specifies the delay of showing elements these possible vales are 'slow', 'fast' and milliseconds. Callback function to be called after completion of slideDown()

```
<!DOCTYPE html>
<html>
<head>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
    <script>
        $(document).ready(function () {
            $('#flip').click(function () {
                $('#panel').slideDown('slow');
            });
        });
    </script>
    <style>
        #flip {
            padding: 10px;
            text-align: center;
            background-color:red;
            background-color: #e5eecc;
            border: solid 1px green;
        }
        #panel {
            padding: 50px;
            text-align: center;
            background-color:yellow;
            background-color: #e5eecc;
            border: solid 1px green;
            display:none;
        }
    </style>
</head>
<body>
    <div id='flip'>Click to slide up and down panel</div>
    <div id='panel'>This is slide up panel </div>
</body>
</html>
```

![what the role of slideDown method in JQuery?](https://answers.mindstick.com/questionanswer/fa791e76-adf1-44f9-bd59-495e09ad43f0/images/d374d7c9-a99f-4c66-a4bf-e5f6cef36976.png)\


---

Original Source: https://answers.mindstick.com/qa/93796/what-the-role-of-slidedown-method-in-jquery

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
