Skip to content

Instantly share code, notes, and snippets.

@luqmansen

luqmansen/Countdown.html

Last active November 3, 2019 06:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save luqmansen/05c2943d2583086e91a580d3cce2e435 to your computer and use it in GitHub Desktop.
Save luqmansen/05c2943d2583086e91a580d3cce2e435 to your computer and use it in GitHub Desktop.
Download ZIP
Simple Js Countdown Timer
Raw
Countdown.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Countdown Timer</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body>
<div class="text-center text-xs-center">
<h2>Countdown Timer</h2>
<form id="form">
<input type="text" placeholder="input the time in second" id="timerCount" />
<input type="button" value="submit" onclick="getData()" />
</form>
<h2 id="timer">00:00</h2>
</div>
</body>
<script>
function timer(duration, show) {
var timer = duration, minutes, seconds;
var interval = setInterval(function ()
{
if (--timer < 0) {
timer = 0;
clearInterval(interval);
alert("Times up");
}
minutes = parseInt(timer / 60, 10);
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
show.textContent = minutes + ":" + seconds;
}, 1000);
}
function getData() {
let time = document.getElementById("timerCount").value;
time = parseInt(time)
time += 1
console.log(time)
show = document.querySelector("#timer");
timer(time, show);
}
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment