Triggering Scroll Event for Lazy Load JQuery Plugin
-
21-12-2019 - |
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.
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
.