Usando jQuery para realizar acciones en secuencia

Estoy usando el pantalla completa Complemento jQuery en mi página. Primero, escondo la imagen, luego ejecuto fullscreenr en ella usando el complemento waitforimage, y finalmente uso fadeIn para mostrarla:

<img id="bgimg" style="display: none;" src="<?php bloginfo('template_url')?>/images/backgrounds/<?php echo $imageData['location']; ?>" />

<script type="text/javascript">
    $bg = $('#bgimg');
    $bg.hide();
    var FullscreenrOptions = {  width: <?php echo $imageData['width']; ?>, height: <?php echo $imageData['height']; ?>, bgID: '#bgimg' };
    $bg.waitForImages(jQuery.fn.fullscreenr(FullscreenrOptions));
    $bg.fadeIn(2500);
</script>

Mi problema es que, de alguna manera, algo no funciona del todo bien. Esto funciona bien en mi caja de desarrollo, pero cuando trato de cargar la página en la web, el fundido de entrada comienza antes de que la imagen esté completamente cargada.

Intenté agregar una devolución de llamada a la función fullscreenr, pero tuvo los mismos resultados. ¿Qué puedo hacer para asegurarme de que funciona correctamente? También intenté usar $bg.load() para cargar fullscreenr y nuevamente, sin suerte.

¡Gracias!

preguntado el 03 de mayo de 12 a las 10:05

¿Podrías publicar el load() código que usaste. Parece la mejor solución, así que no estoy seguro de por qué no funcionó para ti. -

1 Respuestas

Cuando tiene llamadas a funciones anidadas como function2(function1(whatever)) primero se ejecutará la función interna y luego la función externa. Entonces, en su caso, la llamada fullscreenr() se aplicará ANTES de waitForImages ... y eso explicaría el comportamiento.

En el segundo vistazo, supongo que esto es lo que querías hacer.

$bg.waitForImages(function() {jQuery.fn.fullscreenr(FullscreenrOptions)});

contestado el 03 de mayo de 12 a las 10:05

Entonces, ¿estaba esperando por imagen el valor de retorno de la función fullscreenr en lugar de pasar una función para llamar una vez que se cargó la imagen? ¿Sería lo mismo si usara la función load()? - dougalg

*"Estaba pasando"... Probaré esto cuando llegue a casa - dougalg

¿Probaste mi código sugerido? Debería devolver la función anónima como una devolución de llamada a waitForImages en lugar de llamar inmediatamente a fullscreenr - devnull69

Bien, intenté lo que sugeriste y no funcionó, pero luego lo cambié a load() en lugar de waitForImages y sí funciona. ¿Cuál es la diferencia entre pasar function(){blah()} y simplemente blah() ? ¿Cómo sabe JS/jQuery que uno es una referencia a una función y el otro es una llamada de función? - dougalg

Si no var whatever = function() {anotherFunction();} pasa una función (también conocida como una referencia de función) a la variable. Tan pronto como llame a esta función, anotherFunction() será ejecutado. Los paréntesis () desencadenan la ejecución inmediata de una función. Entonces var whatever = anotherFunction() ejecutará inmediatamente la función y asignará el resultado (es decir, el valor de retorno) a la variable que sea. - devnull69

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