<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Custom Timer</title>
</head>
<body>
<h1>Custom Timer</h1>
<div id="timer"></div>
<script>
// Function to start the timer
function startTimer(hours, minutes, seconds) {
// Calculate the total duration in seconds
let totalSeconds = hours * 3600 + minutes * 60 + seconds;
// Update the timer display every second
let timerInterval = setInterval(function() {
// Calculate hours, minutes, and seconds remaining
let hoursRemaining = Math.floor(totalSeconds / 3600);
let minutesRemaining = Math.floor((totalSeconds % 3600) / 60);
let secondsRemaining = totalSeconds % 60;
// Display the timer
document.getElementById('timer').innerText = `${hoursRemaining.toString().padStart(2, '0')}:${minutesRemaining.toString().padStart(2, '0')}:${secondsRemaining.toString().padStart(2, '0')}`;
// Decrement totalSeconds
totalSeconds--;
// Check if the timer has reached 0
if (totalSeconds < 0) {
clearInterval(timerInterval);
document.getElementById('timer').innerText = "Timer Expired!";
// Wait for 10 seconds before restarting the timer
setTimeout(function() {
// Reset the total duration
totalSeconds = hours * 3600 + minutes * 60 + seconds;
// Start the timer again
timerInterval = setInterval(updateTimer, 1000);
}, 10000); // 10 seconds delay
}
}, 1000); // Update every second
}
// Start the timer with the specified duration (e.g., 1 hour, 30 minutes, 45 seconds)
startTimer(0, 0, 10); // Change the duration as needed
</script>
</body>
</html>
Custom Timer
Custom Timer
Here many types of latest technology news, many useful (tools, software, apps, website, technical problem solution )If you have any query regrading Site, Advertisement and any other issue, please feel free to contact me