Javascript Clock

Forum › Forums › General › Software › Javascript Clock

  • This topic has 0 replies, 1 voice, and was last updated Jun 18-5:32 pm by Brian Masinick.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • June 18, 2022 at 5:32 pm #84814
    Moderator
    Brian Masinick

      https://www.geeksforgeeks.org/how-to-design-digital-clock-using-javascript/

      <!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content=
		"width=device-width,
		initial-scale=1.0" />

	<title>Digital Clock</title>

	<style>
		#clock {
			font-size: 175px;
			width: 900px;
			margin: 200px;
			text-align: center;
			border: 2px solid black;
			border-radius: 20px;
		}
	</style>
</head>

<body>
	<div id="clock">8:10:45</div>

	<script>
		setInterval(showTime, 1000);
		function showTime() {
			let time = new Date();
			let hour = time.getHours();
			let min = time.getMinutes();
			let sec = time.getSeconds();
			am_pm = "AM";

			if (hour > 12) {
				hour -= 12;
				am_pm = "PM";
			}
			if (hour == 0) {
				hr = 12;
				am_pm = "AM";
			}

			hour = hour < 10 ? "0" + hour : hour;
			min = min < 10 ? "0" + min : min;
			sec = sec < 10 ? "0" + sec : sec;

			let currentTime = hour + ":"
				+ min + ":" + sec + am_pm;

			document.getElementById("clock")
				.innerHTML = currentTime;
		}

		showTime();
	</script>
</body>

</html>

      --
      Brian Masinick

    • Author
      Posts
    Viewing 1 post (of 1 total)
    • You must be logged in to reply to this topic.