JavaScript Timer Last Updated : 03 Jun, 2024 Comments Improve Suggest changes Like Article Like Report A timer has been shown that shows the countdown, and its color/message gets changed after every specific period. Prerequisites: GetMinutes()GetSeconds()SetInterval() MethodSyntax: setTimeout(function, milliseconds, parameter1, ...);Parameter:AttributeDescriptionfunctionIt is the function that will be executed.millisecondsIt is the number of milliseconds to wait before executing the code. Optional, default value is zero (0).parameter1It is an additional parameter to pass to the function. Optional.Return Value: It returns a number representing the ID value of the timer that is set. JavaScript code that sets the timer to 2 minutes and when the time is up the Page alert "times up". The setTimeout() method calls a function or evaluates an expression after a specified number of milliseconds. Example: In this example, we will start a timer and display a message when the timer stops. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <script> let mins = .1; let secs = mins * 60; function countdown() { setTimeout('Decrement()', 60); } function Decrement() { if (document.getElementById) { minutes = document.getElementById("minutes"); seconds = document.getElementById("seconds"); if (seconds < 59) { seconds.value = secs; } else { minutes.value = getminutes(); seconds.value = getseconds(); } if (mins < 1) { minutes.style.color = "red"; seconds.style.color = "red"; } if (mins < 0) { alert('time up'); minutes.value = 0; seconds.value = 0; } else { secs--; setTimeout('Decrement()', 1000); } } } function getminutes() { mins = Math.floor(secs / 60); return mins; } function getseconds() { return secs - Math.round(mins * 60); } </script> <body onload="countdown();"> <div style="display: flex; width:80%; justify-content:center; padding-top: 0%;"> Time Left :: </div> <div style="display: flex; width:80%; justify-content:center; padding-top: 0%;"> <input id="minutes" type="text" style="width: 2%; border: none; font-size: 16px; font-weight: bold; color: black;"> <font size="5"> : </font> <input id="seconds" type="text" style="width: 2%; border: none; font-size: 16px; font-weight: bold; color: black;"> </div> </body> </html> Output: Comment More infoAdvertise with us Next Article JavaScript Timer N Naman_Garg Follow Improve Article Tags : JavaScript Web Technologies javascript-functions javascript-basics JavaScript-Questions +1 More Similar Reads JavaScript setTimeout() Method JavaScript setTimeout() method allows you to schedule the execution of a function or the evaluation of a code after a specified delay. The setTimeout() method calls a function after several milliseconds. setTimeout() is for executing a function once after a specified delay. Syntax:setTimeout(functio 2 min read JavaScript setInterval() Method The setInterval() method calls a function at specified intervals (in milliseconds). It continues calling the function until clearInterval() is called or the window is closed. This method is useful for tasks that need periodic execution, like updating animations or refreshing data. Important Note: se 2 min read Foundation CSS JavaScript Timer Utility Foundation CSS is a responsive front-end framework for web development. It includes a variety of CSS and JavaScript utilities that can be used to build and style web applications. One of the JavaScript utilities included in Foundation is a timer utility, which can be used to execute a function after 3 min read How to Detect Idle Time in JavaScript ? The idle time is the time that the user doesn't interact with a web page. This interaction can be either moving the mouse, clicking on the page, or using the keyboard. This time can be detected to execute certain events that may need to occur after a certain period of idle time. \ Method 1: Using Ja 4 min read JavaScript - How To Create A Countdown Timer? A countdown timer is a timer that runs for a specific time limit and when that limit get crossed then it stops the timer and the message get displayed on the screen. it can be used for a website or blog to display the countdown to any special event, such as a birthday or anniversary.The Basics of a 4 min read Like