What is the use of delay() method in jQuery ?
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="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <style> div { width: 250px; height: 200px; display: none; background-color: green; } </style></head><body> <center> <h1 style="color: green;"> w3wiki </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:
Contact Us