Per Pfeiltasten auf Webseite navigieren mit Jquery!

Manchmal möchte man seinen Besuchern die Möglichkeit geben auch mit dem Keyboard auf einer Webseite zu navigieren. Man möchte aber vielleicht nicht unbedingt dem User eine Keymap einblenden so dass er sehen kann welche Knöpfe es nun zu drücken gilt, um vor und zurück zu kommen. Es bieten sich also die Pfeiltasten an, da diese bereits ohne Erklärung für vor und zurück stehen. Da diese Tasten aber leider schon von den meisten Programmen vorbelegt sind muss man den Umweg über Javascript gehen um eine vernünftige, halbwegs kompatible Lösung an den Start zu bekommen. Dieses kleine Script ermöglicht die Pfeiltastennavigation mit den Cursor-Tasten Rechts und Links

$(document).keyup(function (event) {
if (event.keyCode == 39) {
window.location = nextUrl
} else if (event.keyCode == 37) {
window.location = prevUrl
}
});

$(document).ready(function() {
var nextPage = $(”#next_page_link”)
var prevPage = $(”#previous_page_link”)
nextUrl = nextPage.attr(”href”)
prevUrl = prevPage.attr(”href”)
});

Durch Tastendruck werden nun die Links mit den IDs “previous_page_link” und “next_page_link” ausgeführt.

Viel Spaß beim navigieren!

Nach oben