Domanda

Sto lavorando con Lazy Load per caricare le immagini solo quando sono visibili e le immagini che sono visibili e le immagini I primi sono visibili da un menu POPOUT non sono carichi. Tutte le immagini si trovano all'interno di elementi <li> su un elenco non ordinato. Quando inizio a scorrere l'elenco, le immagini iniziano a caricare come dovrebbero. Ma come faccio a mostrare le poche prima immagini da mostrare quando viene aperto il menu?

Ho cercato di innescare l'evento scroll, insieme ad altri eventi, ma nessuno di loro sembrava funzionare. Il <ul> si trova all'interno di un menu che si apre da un "Infobar" (solo un bar con collegamenti nella parte superiore della pagina). Stavo pensando che forse questo avesse qualcosa a che fare con il fatto che (le immagini) non sono facilmente visibili sul carico della pagina?

Ecco la mia inizializzazione del layload:

$("img.lazy", this.list).show().lazyload({
  effect: "fadeIn",
  container: this.list,
  threshold: 50
});

$(this.list).trigger("scroll"); // tried this
$(document).trigger("scroll"); // and that

// this.list is the unordered list
.

Ho anche provato a inizializzare il plugin con mouseenter e scrollstop come proprietà event, quindi innescando tali eventi, senza fortuna.

È stato utile?

Soluzione

Il secondo this.list è dove stai andando male.Lazy Load funziona su elementi <img> e non su <ul>

$("img.lazy", this.list).trigger("scroll"); // should work
.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top