Навигация с помощью клавиш со стрелками (далее и назад) для изменения имени файла

Question

У меня есть куча HTML-файлов с разными именами файлов, мне нужно добавить опцию, чтобы использовать клавиши со стрелками клавиатуры для навигации (предыдущий и следующий файл).

Имена файлов не являются динамическими.. например: filename.html, anotherfile.html, thirdone.html и т. Д.

Так что мне нужно, что в файле.js для навигации, и что я должен связать предыдущие, следующие кнопки в файле HTML?

Answer 1

Если бы вы должны были определить два идентификатора на двух <a> теги вроде так:

<a id="prev" href="filename.html">prev</a>
<a id="next" href="thirdone.html">next</a>

Вы могли бы сделать что-то подобное в navigation.js и включите его на каждой странице:

// 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;
            }
        }
    });
});

Вы могли бы даже использовать немного CSS, чтобы сделать #prev, #next { display: none; } или поиграйтесь с абсолютно позиционированными треугольниками CSS.