gistfile1.js

var shown = false;
window.onload = function () {
    window.addEventListener("keydown",keyDown);
    window.addEventListener("keyup",keyUp);

    document.body.innerHTML += '<div id="keylog" style="width: 100px; height: 100px; background-color: #ccc; opacity: 0.9; top: 30%; left: 45%; position: absolute; z-index: 5; display: none; font-size: 100px; line-height:100px; color: white; font-weight: bold; padding: 40px; text-align: center; border-radius: 10px; -moz-border-radius: 10px; font-family: Helvetica, sans-serif;"></div>';
};


function keyDown(e) {
    if (!shown) {
        var c = String.fromCharCode(e.which);

        document.getElementById("keylog").style.display = "block";
        document.getElementById("keylog").innerHTML = c;
        shown = true;
    }

}

function keyUp() {
    if (shown)
        document.getElementById("keylog").style.display = "none";
}