Skip to content

Instantly share code, notes, and snippets.

@mcenirm
Created January 12, 2013 04:08
Show Gist options
  • Save mcenirm/4516014 to your computer and use it in GitHub Desktop.
Save mcenirm/4516014 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<style>
.bar {
height: 1em;
background-color: lightblue;
}
td {
text-align: right;
}
</style>
<table id='x'/>
<script>
var TICK = 10;
var x = document.getElementById('x');
var i = 0;
var t = Date.now();
function tick() {
if (x.childElementCount > 9) {
x.removeChild(x.firstChild);
}
i++;
var t_ = t;
t = Date.now();
var v = Math.round(t - t_);
if (v < TICK * 0.9 || v > TICK * 1.1) {
var tr = document.createElement('tr');
var td;
td = document.createElement('td');
td.textContent = ""+i;
tr.appendChild(td);
td = document.createElement('td');
td.textContent = ""+v;
tr.appendChild(td);
td = document.createElement('td');
var d = document.createElement('div');
d.className = 'bar';
d.style.width = ""+v+"px";
td.appendChild(d);
tr.appendChild(td);
x.appendChild(tr);
}
}
var _ = setInterval(tick,TICK);
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment