I have a bunch of html files with different file-names, that I need to add an option to use keyboard arrow keys to navigate (previous and next file).
The file-names are
If you were to define two ID's on two tags like so:
prev
next
You could do something like this in navigation.js
and include it from every page:
// when the document is ready, run this function
jQuery(function( $ ) {
var keymap = {};
// LEFT
keymap[ 37 ] = "#prev";
// RIGHT
keymap[ 39 ] = "#next";
$( document ).on( "keyup", function(event) {
var href,
selector = keymap[ event.which ];
// if the key pressed was in our map, check for the href
if ( selector ) {
href = $( selector ).attr( "href" );
if ( href ) {
// navigate where the link points
window.location = href;
}
}
});
});
You could even use a little CSS to make the #prev, #next { display: none; }
or play around with absolutely positioned CSS triangles.