Question

je travaille avec Charge paresseuse pour charger les images uniquement lorsqu'elles sont visibles et que les images visibles pour la première fois dans un menu contextuel ne se chargent pas.Toutes les images sont situées à l'intérieur <li> éléments sur une liste non ordonnée.Lorsque je commence à faire défiler la liste, les images commencent à se charger comme elles le devraient.Mais comment puis-je afficher les premières images lors de la première ouverture du menu ?

J'ai essayé de déclencher le scroll événement, ainsi que d’autres événements, mais aucun d’entre eux n’a semblé fonctionner.Le <ul> est situé dans un menu qui sort d'une "barre d'informations" (juste une barre avec des liens en haut de la page).Je pensais que cela avait peut-être quelque chose à voir avec le fait qu'elles (les images) ne sont pas facilement visibles lors du chargement de la page ?

Voici mon initialisation lazyload :

$("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

J'ai également essayé d'initialiser le plugin avec mouseenter et scrollstop comme le event propriétés, puis déclencher ces événements, pas de chance.

Était-ce utile?

La solution

La deuxième this.list c'est là que tu te trompes.Lazy Load fonctionne sur <img> éléments et non sur <ul>

$("img.lazy", this.list).trigger("scroll"); // should work
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top