Skip to content

Instantly share code, notes, and snippets.

@RobCranfill
Created December 27, 2020 01:34
Show Gist options
  • Save RobCranfill/d9b3cd8b51358ca5d68edad715672e1b to your computer and use it in GitHub Desktop.
Save RobCranfill/d9b3cd8b51358ca5d68edad715672e1b to your computer and use it in GitHub Desktop.
Simple HTML page showing use of setInterval and mucking with the DOM.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="30">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<link href='https://fonts.googleapis.com/css?family=Stylish' rel='stylesheet'>
<link rel="icon" type="image/png" href="favicon.ico" />
<style>
.currentTime {
font-family: 'Stylish'; font-size:160px;
# border: 1px outset red;
background-color: lightgreen;
text-align: center;
line-height: 100%;
padding-top: 25px;
padding-bottom: 25px;
}
</style>
<script>
function startUpdater() {
setInterval(updateTime, 1000);
}
function updateTime() {
var now = new Date();
var h = now.getHours();
var am_pm = "AM";
if (h >= 12) {
am_pm = "PM";
}
if (h >= 13) {
h = h - 12;
}
var m = now.getMinutes();
if (m < 10) {
m = "0" + m;
}
var s = now.getSeconds();
if (s < 10) {
s = "0" + s;
}
document.getElementById('currentTime').innerHTML = h + ":" + m + ":" + s + " " + am_pm;
}
</script>
</head>
<body onload="startUpdater()">
<div class="currentTime" id="currentTime">???</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment