Skip to content
Related Articles
Get the best out of our app
GFG App
Open App
geeksforgeeks
Browser
Continue

Related Articles

What is the use of delay() method in jQuery ?

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

In this article, we will see how to use the delay() method and why to use it in jQuery. The delay() method is used to set a timer to delay the execution of the next item in the queue.

Syntax:

$(selector).delay(para1, para2);

In the below example, first, we create a div of size 250px X 200px and set its display property to none. Also, created a button that will call the delay() method. When the user clicks on the button, the delay() method and fadeIn() method are called. The delay() method takes a 2000ms value which means the div will display after 2000ms.  

Example: In this example, we are using the delay() method.

HTML




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
    <!-- Including jQuery -->
    <script src="
    </script>
    <style>
        div {
            width: 250px;
            height: 200px;
            display: none;
            background-color: green;
        }
    </style>
</head>
<body>
    <center>
        <h1 style="color: green;">
            GeeksforGeeks
        </h1>
        <h3>
            What is the use of delay()
            method in jQuery?
        </h3>
        <div></div>
        <br>
        <button id="delay">delay() method</button>
    </center>
    <script>
        $(document).ready(function() {
            $('#delay').click(function() {
                $('div').delay(2000).fadeIn();
            });
        });
    </script>
</body>
</html>


Output:


My Personal Notes arrow_drop_up
Last Updated : 02 Jun, 2023
Like Article
Save Article
Similar Reads
Related Tutorials