jQuery delay fade reescribe el código

I have the following jquery code to fade in sequentially a couple of images inside #test div:

$("#test img").each(function(index) {
    $(this).delay(500*index).fadeIn(1000);
}); 

This works great. Immediately after this in the script i have the following:

$('#test img#img1').delay(5000).fadeOut(1000);
$('#main-content').delay(5000).fadeIn(1000);
$('#menu').delay(5000).fadeIn(1000);
$('#test img#img2').delay(5500).fadeOut(1000);
$('#test img#img3').delay(5500).fadeOut(1000);

This second series of fade works fine apart on IE7. On IE7, this second set of code happens all at once, without any delay.

My question is, how do i re-write this second set to something simple like the first? I'm kind of hoping that by doing so, it will work fine on IE7. I've tried something like the following but it didn't work...

$("#test img").each(function(index) {
    $(this).delay(500*index).fadeIn(1000, function() {
        $('#test img#img1').delay(5000).fadeOut(1000, function() {
            $('#main-content').delay(500).fadeIn(1000, function() {
                $('#menu').delay(500).fadeIn(1000, function() {
                    $('#test img#img2').delay(500).fadeOut(1000, function() {
                        $('#test img#img3').delay(500).fadeOut(1000);
                    });
                });
            });
        });
    });
});

¿Alguna idea? ¡Gracias por tu tiempo!

preguntado el 08 de noviembre de 11 a las 09:11

1 Respuestas

Just like the first one, just with different selector:

$("#img1, #main-content, #menu, #img2, #img3").each(function(index) {
    $(this).delay(500 * index).fadeOut(1000);
});

Note: there is no need to use id dentro id selector'#test img#img1').
The id is unique anyway, just use '#img1'.

respondido 08 nov., 11:13

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