LazyLoad immagini non visualizzate fino a dopo una pergamena

Question

Sto utilizzando il plug-in lazyload per jQuery.

Sta funzionando bene, tranne un problema: le immagini src non vengono scambiate per l'originale dei dati finché non si scorre. Una volta che si scorre, anche un po ', le immagini vengono caricate, ma ho bisogno che vengano caricate quando la pagina è pronta.

Una nota: si tratta di un problema di Chrome/Safari. Non ho questo problema in Firefox o Opera, o anche IE9.

Ho provato seguendo il suggerimento di questo post: http://sumanrs.wordpress.com/2011/02/08/jquery-lazy-loading-images-no-scrolling/ in cui si afferma che la libreria di base jQuery ha la capacità di caricamento pigro, senza un plugin necessario. Questo sembrava non essere così, come le immagini appena caricate tutte sul caricamento iniziale della pagina.

Qualsiasi approfondimento è molto apprezzato!

Answer 1

risolto il proprio problema: È necessario impostare l'altezza e una larghezza sull'immagine!

Answer 2

Si potrebbe simulare/innescare un evento di scorrimento per attivare l'effetto sul pageload: http://api.jquery.com/scroll/

Answer 3

Molto probabilmente le immagini non hanno larghezza e altezza impostate. I browser Webkit vedranno le immagini su document.ready con larghezza e altezza pari a zero. Ciò significa che jQuery considererà le immagini invisibili. Lazy Load ignora le immagini invisibili per impostazione predefinita. Hai tre opzioni.

1. Correggi HTML per avere gli attributi di larghezza e altezza sulle immagini.
2. Impostare skip_invisible a false.
3. Utilizzare atleast version 1.8.3 del plug-in.

Answer 4

$(window).resize(); 

mi ha aiutato nel mio caso.

Answer 5

Prova questo:

$('img.lazy').lazyload(); 
$(window).scroll(); 

Answer 6

ho avuto un problema simile. L'opzione di soglia risolto per me:

$("img.lazy").lazyload({ 
    threshold : 400 
}); 

Answer 7

Per me il problema è che ho chiamato $('img.lazy').lazyload() in ready

Collocato all'interno load invece.

$(window).load(function(){ 
    $('img.lazy').lazyload() 
}); 

Answer 8

Ho utilizzato il plug-in jquery con caricamento lazy ma il caricamento sta causando un problema. (es.) è più scorrevole nel browser crome. Ma sfortunatamente non funziona correttamente in mozilla fire fox. sto ricevendo questa notifica da mozilla fire fox (Uno script su questa pagina potrebbe essere occupato, o potrebbe aver smesso di rispondere. Puoi fermare lo script ora, aprire lo script nel debugger o lasciare che lo script continui.). Quindi rispondi a qualsiasi idea migliore per evitare questo bug.

Answer 9

Ho avuto lo stesso problema.

Risolto in questo modo:

Basta sostituire la classe "pigro" dalle prime immagini sulla pagina.

;-)