Imagen de encuadernación cargada de carga a las imágenes nuevas insertadas después de la solicitud de ajax

Question

Estoy usando el complemento Lazy Load de Mika Tuupola http://www.appelsiini.net/projects/lazyload para retrasar la carga de imágenes a medida que se desplaza hacia abajo en una galería de imágenes larga. El problema es después de 10 imágenes, utilizo el desplazamiento infinito, así que tomo las siguientes 10 imágenes y las anexo a través de ajax. Lazy Lazy ya no funciona en este próximo lote de imágenes adjuntas.

Es una bonita galería de imágenes de javascript, así que para todo lo demás (como información sobre herramientas, superposiciones modales, etc.) he estado utilizando el delegado de jQuery() para enlazar elementos ajax-insertados. El problema con el complemento Lazy Load es que no estoy seguro de a qué vincular el evento .

Digamos que quiero cargar fotos cargadas con una clase de "perezoso". Me gustaría escribir esto:

$("img.lazy").lazyload({ 
    effect: "fadeIn" 
}); 

y funciona durante las primeras 10 imágenes, pero deja de funcionar después de insertar más a través de ajax. Lo único que se me ocurre es utilizar delegado en un eventode carga, así:

$(document).delegate("img.lazy", "load", function(event) { 
    $(this).lazyload({ 
     effect: "fadeIn" 
    });  
}); 

pero que rompe todo. Gracias!

EDIT: El jQuery I utilizar para cargar más registros (esta es una aplicación Rails):

$(window).scroll(function() { 
    var url; 
    url = $(".pagination .next_page").attr("href"); 
    if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) { 
    $(".pagination").html("<p>loading more images...</p>"); 
    return $.getScript(url); 
    } 
}); 

$(window).scroll(); 

Answer 1

me gustaría utilizar el método ajaxStop.

$("img.lazy").lazyload({ 
    effect: "fadeIn" 
}).removeClass("lazy"); 
$(document).ajaxStop(function(){ 
    $("img.lazy").lazyload({ 
     effect: "fadeIn" 
    }).removeClass("lazy"); 
}); 

removeClass previene la doble inicialización.

Answer 2

Además de la respuesta de Kevin B si se quiere evitar ajaxStop jQuery ahora define una función when() para ese propósito

// the following code will be executed when the ajax request resolve. 
// the ajax function must return the value from calling the $.ajax() method. 

    $.when(load_new_image(1), load_new_image(2), load_new_image(3)).done(function(i1, i2, i3){ 

      if($('img.lazy').length){ 

       $('img.lazy').lazyload({ 

          effect:'fadeIn' 

       }).removeClass('lazy').addClass('lazyloaded'); 

      } 

     }); 

     function load_new_image(image_id) { 

      return $.ajax({ 
       url: "someUrl", 
       dataType: "json", 
       data: yourJsonData,    
       ... 
      }); 
     } 

de: http://api.jquery.com/jQuery.when/