Skip to content

Instantly share code, notes, and snippets.

@midudev

midudev/index.html

Created July 3, 2013 15:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save midudev/5919102 to your computer and use it in GitHub Desktop.
Save midudev/5919102 to your computer and use it in GitHub Desktop.
Download ZIP
A CodePen by Miguel. Which keycode is? - Discover which keycode is the key pressed. A simple script with pure JS to now the keyCode of the keyDown.
Raw
index.html
<body>
<a href="//miduga.es" title="Desarrollado por miduga para desarrolladores">Developed by miduga</a>
<div id="i">
Press a key<br/><span>And discover his keyCode to use it in your JavaScript projects.</span></div>
<div id="k"></div>
Raw
script.js
var d = document,i=d.getElementById('i'),
k = d.getElementById('k');
d.onkeydown = d.body.onkeydown = function(e)
{
e = e || window.event;
i.innerHTML = '';
k.innerHTML = e.keyCode || e.which;
return false;
}
Raw
style.css
body {
font-weight: 300;
font-family: "Roboto Condensed", "Helvetica Neue", "Open Sans Condensed", sans-serif;
margin: 0;padding: 0;}
body:before {
box-shadow: 0 0 10px rgba(168, 168, 168, 0.8);
content: "";
height: 10px;
left: 0;
position: fixed;
top: -10px;
width: 100%;
z-index: 100;
}
a {
text-decoration: none;
color: #008ccd;
transition: all 0.12s ease-out;
text-align: center;
width: 100%;
display: block;
bottom: 15px;
position: absolute;
}
#i, #k {
position: fixed;
font-size: 200px;
text-align: center;
width: 100%;
left: 0;
height: 200px;
line-height: 30px;
top: 50%;
margin-top: -50px;
color: #777;
text-shadow: -1px -1px 0px #fff;}
span {
font-size: 20px;
color: #999
}
#i {
font-size: 80px
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment