← Wszystkie przykłady

JavaScript Nawigacja

Link „Przejdź do treści”

Dodaje ukryty link, który po użyciu Tab pozwala od razu skoczyć do głównej treści.

Kod do skopiowania

var target = document.querySelector('main, [role="main"], #content, article');
if (target) {
  if (!target.id) { target.id = 'nv-main-content'; }
  var link = document.createElement('a');
  link.href = '#' + target.id;
  link.textContent = 'Skip to content';
  link.style.cssText = 'position:fixed;top:-100px;left:8px;z-index:99999;background:#006870;color:#fff;padding:8px 14px;border-radius:4px;text-decoration:none';
  link.addEventListener('focus', function () { link.style.top = '8px'; });
  link.addEventListener('blur', function () { link.style.top = '-100px'; });
  document.body.insertBefore(link, document.body.firstChild);
}

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