#javascript-code-09-keyCode.js / js
// Locate the first <li> element on the page var cur = document.getElementsByTagName(“li”)[0]; // and make sure that it’s visible cur.style.display = ‘block’; // Watch for any keypresses on the page document.onkeypress = function(e){ // Normalize the Event object e = e || window.event; // If the left or right arrow keys were pressed if ( e.keyCode == 37 || e.keyCode == 39 ) { // hide the currently displayed <li> element cur.style.display = ‘none’; // If the left arrow was pressed, find the previous <li> element // (or loop back around and go to the last one) if ( e.keyCode == 37 ) cur = cur.previousSibling || cur.parentNode.lastChild; // If the right arrow key was pressed, find the next <li> element // or if we’re at the end, go back to the first <li> element else if ( e.keyCode == 39 ) cur = cur.nextSibling || cur.parentNode.firstChild; // show the next <li> in the sequence cur.style.display = ‘block’; } };
(C) Æliens 20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.