I have to count down the system clock according to two different times. in hours, minutes, seconds. For example, a day is 24 hours.
Between 15:00:00 and 13:00:00 = 22 hours. When the clock is 15:00:00, it should count back from 22:00:00. and it must be 00:00:00 at 13:00:00.
Between 13:00:00 and 15:00:00 = 2 hours. When the clock is 13:00:00, it should count back from 2:00:00. and it must be 00:00:00 at 15:00:00.
i want it to repeat daily.
I've tried so hard for a few days, but I couldn't. please help me.
I add it again with the code I used.
- <!DOCTYPE html>
- <html>
- <head>
- <title></title>
- <script type="text/javascript" src="jquery-3.4.1.js"></script>
- </head>
- <body>
-
-
- <script type="text/javascript">
-
- var timer = setInterval(function() {
- var now= new Date().getTime();
-
- var endtime= new Date(13);
- var t = now - endtime;
-
- var endtime2= new Date(15);
- var y = now - endtime2;
-
-
- if (t <= 21) {
- let hours = Math.floor((t % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
- let minutes = Math.floor((t % (1000 * 60 * 60)) / (1000 * 60));
- let seconds = Math.floor((t % (1000 * 60)) / 1000);
-
- document.getElementById("timer-hours").innerHTML= ("0" + hours).slice(-2) +
- "<span class='label'> hr</span>";
-
- document.getElementById("timer-minutes").innerHTML= ("0" + minutes).slice(-2) +
- "<span class='label'> mn</span>";
-
- document.getElementById("timer-seconds").innerHTML= ("0" + seconds).slice(-2) +
- "<span class='label'> sc</span>";
- }
- if (y >=22) {
- let hours = Math.floor((y % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
- let minutes = Math.floor((y % (1000 * 60 * 60)) / (1000 * 60));
- let seconds = Math.floor((y % (1000 * 60)) / 1000);
-
- document.getElementById("timer-hours").innerHTML= ("0" + hours).slice(-2) +
- "<span class='label'> hr</span>";
-
- document.getElementById("timer-minutes").innerHTML= ("0" + minutes).slice(-2) +
- "<span class='label'> mn</span>";
-
- document.getElementById("timer-seconds").innerHTML= ("0" + seconds).slice(-2) +
- "<span class='label'> sc</span>";
- }
- else {
- document.getElementById("timer").innerHTML = "There is a problem!";
- }
- }, 1000);
- </script>
-
- <div class="container">
- <p id="timer">
-
- <span id="timer-hours"></span>
- <span id="timer-minutes"></span>
- <span id="timer-seconds"></span>
- </p>
- </div>
-
- </body>
- </html>