Skip to content

Instantly share code, notes, and snippets.

@kebman
Created December 23, 2015 02:38
Show Gist options
  • Save kebman/5d4fc1f0b40ab05b51fc to your computer and use it in GitHub Desktop.
Save kebman/5d4fc1f0b40ab05b51fc to your computer and use it in GitHub Desktop.
Simple Tic Toc in HTML5
<!DOCTYPE html>
<html>
<head>
<title>Tic Toc</title>
<meta charset="utf-8">
</head>
<body>
<header>
<h1>Tic Toc</h1>
</header>
<article>
<div id="clock"></div>
</article>
</body>
<script>
// get DOM element
var div = document.getElementById("clock");
// function to publish to DOM element
function publish(msg) {
var p = document.createElement("p");
var tn = document.createTextNode(msg);
p.appendChild(tn);
div.appendChild(p);
}
// tic toc
var tic = true;
var interval = setInterval(function () {
if (tic) {
publish("tic");
tic = false;
} else {
publish("toc");
tic = true;
}
// when treshold value is reached...
if(div.children.length >= 7) {
div.removeChild(div.childNodes[0]); // remove the top element inside the div
}
}, 1000); // repeat the function once every second
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment