← Tutti gli esempi

JavaScript Navigazione etsy.com

Etsy: galleria foto con le frecce

Permette di sfogliare le foto del prodotto con le frecce sinistra e destra, senza mouse.

Codice da copiare

// Browse the listing photo gallery with the left/right arrow keys
function thumbs() {
  return Array.from(document.querySelectorAll(
    '[data-component="listing-page-image-carousel"] '
    + 'button, .listing-page-image-carousel-component li button'));
}
document.addEventListener('keydown', function (e) {
  if (e.target.matches('input, textarea')) { return; }
  const list = thumbs();
  if (!list.length) { return; }
  let idx = list.findIndex(function (b) {
    return b.getAttribute('aria-current') === 'true'
      || b.classList.contains('is-selected');
  });
  if (e.key === 'ArrowRight') { (list[idx + 1] || list[0]).click(); }
  if (e.key === 'ArrowLeft') {
    (list[idx - 1] || list[list.length - 1]).click();
  }
});

Come usare questo esempio

  1. Copia il codice con il pulsante qui sopra.
  2. Installa JustZix (2 minuti) e apri l'estensione sulla pagina di destinazione.
  3. Aggiungi una nuova regola corrispondente a quella pagina.
  4. Incolla il codice nel pannello JavaScript della regola e salva — viene eseguito a ogni visita della pagina.

Valuta questo esempio

Nessuna valutazione — sii il primo.

Questo esempio funziona?

Gli snippet sono inutili senza un posto dove incollarli.

JustZix si installa in 2 minuti ed esegue il tuo codice su ogni pagina corrispondente. Senza account, senza pagamento.

Scarica gratis Guarda i casi d'uso