digital_clock/index.html at main · Veolinan/digital_clock · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<!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">
    <title>Digital Clock with Glowing Effect | CodingNepal</title>
    <link rel="stylesheet" href="style.css">
 </head>
</head>
<body>

    <div class="wrapper">
        <div class="display">
           <div id="time"></div>
        </div>
        <span></span>
        <span></span>
     </div>
     <script>
        setInterval(()=>{
          const time = document.querySelector(".display #time");
          let date = new Date();
          let hours = date.getHours();
          let minutes = date.getMinutes();
          let seconds = date.getSeconds();
          let day_night = "AM";
          if(hours > 12){
            day_night = "PM";
            hours = hours - 12;
          }
          if(seconds < 10){
            seconds = "0" + seconds;
          }
          if(minutes < 10){
            minutes = "0" + minutes;
          }
          if(hours < 10){
            hours = "0" + hours;
          }
          time.textContent = hours + ":" + minutes + ":" + seconds + " "+ day_night;
        });
     </script>

</body>
</html>