¿Cómo aplicar mi secuencia de comandos a las imágenes a medida que se cargan a través del desplazamiento infinito?

para mi blog, http://seans.ws, escribí una secuencia de comandos que analiza el tamaño de una imagen y, si es más ancha que el tamaño predeterminado del contenedor, calcula cuánto margen negativo necesita para centrarla con el resto del contenido.

Esto funciona muy bien, pero tengo imágenes que se cargan a través de un desplazamiento infinito y mi script no las manipula.

Mi pergamino infinito js: http://static.tumblr.com/q0etgkr/ytzm5f1ke/infinitescrolling.js

$(window).load(function() {
    var centerBigImages = $(function() {
        $('img').css('marginLeft', function(index, value){
        if($(this).width() > 660) {
            return -($(this).width() - 660)/2;            
        }
        return value;
    });
});

centerBigImages();

Eché un vistazo a esto DOMNodeInserted equivalente en IE?, pero estaba un poco por encima de mi cabeza js newb :(

preguntado el 01 de julio de 12 a las 22:07

¿Cómo se ve tu código de desplazamiento infinito? ¿Tiene una devolución de llamada que se ejecuta cuando se carga contenido nuevo? -

Probablemente necesitará agregar centerBigImages como una devolución de llamada dentro de su código de desplazamiento infinito. -

@SeanThompson ¿Tiene una versión no minimizada de JavaScript o alguna documentación de la misma? -

No, he estado buscando pero no parece estar disponible :( -

2 Respuestas

Después de ejecutar un JS-embellecedor en el script minimizado para el pergamino infinito que está usando, pude encontrar esta documentación en japonés. Al ejecutar Google Translate en eso, por lo que puedo ver, debería poder pasar una función de devolución de llamada como el primer parámetro al llamar al SendRequest() método, que creo que usted llama para su pergamino infinito.

En ese caso, debería poder pasar centerBigImages() como primer parámetro:

SendRequest(centerBigImages, ...your other parameters);

Actualizar:

hurgando un poco mas encontre esto sin minificar versión del guión. Desafortunadamente, los comentarios del código están en japonés, pero supongo que también podría ejecutar Google Translate en ellos para obtener información adicional.

Respondido 01 Jul 12, 22:07

Ok, un poco por encima de mi cabeza, ¡pero lo intentaré! Gracias, Christofer :) De hecho, solo estoy usando el script de desplazamiento infinito haciendo lo siguiente:codysherman.com/tools/infinite-scrolling/code"> - sean thompson

@SeanThompson En ese caso, será difícil. Para proporcionar una devolución de llamada, deberá alojar una copia del script en su propio servidor, de modo que pueda modificarlo (para proporcionar una devolución de llamada). El problema es que es un poco difícil mostrarte cómo hacerlo sin una fuente no minificada. - cristofer eliasson

He estado jugando con esta idea últimamente, ya que acabo de personalizar un código para mi blog de Tumblr (que usa desplazamiento infinito). Es un poco circular y no estoy seguro de qué tan bien se admite DOMSubtreeModified ahora o en el futuro, pero pensé que publicaría para el interés general.

var triggerChange = function(event) {
    //do stuff
    monitorChanges();
};

var monitorChanges = function() {
    //Notice the use of 'one' so modifications I make in doStuff does not also cause infinite loop
    jQuery('#outer').one('DOMSubtreeModified', triggerChange);
}

monitorChanges();

Mejor demostrado en violín aquí: http://jsfiddle.net/zf7rG/5/

Respondido 01 Jul 12, 23:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.