← Wszystkie przykłady

JavaScript Nawigacja

Skok między nagłówkami klawiszami n/p

Klawisz n przewija do następnego nagłówka, a p do poprzedniego — z pominięciem pól tekstowych.

Kod do skopiowania

var heads = Array.prototype.slice.call(document.querySelectorAll('h1, h2, h3'));
var idx = -1;
document.addEventListener('keydown', function (e) {
  if (e.target.matches('input, textarea, select, [contenteditable]')) { return; }
  if (e.key !== 'n' && e.key !== 'p') { return; }
  if (!heads.length) { return; }
  idx = e.key === 'n' ? Math.min(idx + 1, heads.length - 1)
                      : Math.max(idx - 1, 0);
  heads[idx].scrollIntoView({ behavior: 'smooth', block: 'start' });
});

Jak użyć tego przykładu

  1. Skopiuj kod przyciskiem powyżej.
  2. Zainstaluj JustZix (2 minuty) i otwórz wtyczkę na docelowej stronie.
  3. Dodaj nową regułę dopasowaną do tej strony.
  4. Wklej kod w panelu JavaScript reguły i zapisz — uruchomi się przy każdym wejściu na stronę.

Oceń ten przykład

Brak ocen — oceń jako pierwszy.

Czy ten przykład działa?

Snippety są bezużyteczne, jeśli nie masz gdzie ich wkleić.

JustZix instalujesz w 2 minuty i odpalasz swój kod na każdej pasującej stronie. Bez konta, bez opłat.

Pobierz za darmo Zobacz zastosowania