Jquery sequential fadeIn and FadeOut - same place

I have three images and I would like them to

First Image: fadeIn, wait a while, then fadeOut; Second Image: (on the same place) fadeIn, wait a while, then fadeOut; Third Image: (on the same place) fadeIn, wait a while, then fadeOut;

//do something...

I have this stupidity so far.

 $(document).ready(function() {

            $('#imagemIntro1').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro1').fadeOut(3800); }, 8000);



            $('#imagemIntro2').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro2').fadeOut(3800); }, 8000);




            $('#imagemIntro3').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro3').fadeOut(3800); }, 8000);


            window.lo开发者_高级运维cation.replace("http://www.something.com");


        });

Can I have your help please?

I would love to learn how to do this, without a specific plugin... :D "I'm running out of time, so, I will use the suggested plugin since, this is really nothing special."

Thanks in advance, MEM

Looks like you are on the right track to cycle through some images. However, there is nothing in your description that seems to be a special requirement. Therefore, I would strongly recommend the jQuery Cycle plugin.

If you want to do it yourself, update your OP.

What you want to do is use callbacks to do this. You end up with a pretty ugly chain, but it works. It would look something like this:

function fadeInNowAndOutLater(sel, callback) {
    $(sel).fadeIn(3800, function() {
        window.setTimeout(8000, function(){$(sel).fadeOut(3800, callback);})
    });
}

fadeInNowAndOutLater('#imagemIntro1', function() {
    fadeInNowAndOutLater('#imagegIntro2', function(){
        fadeInNowAndOutLater('#imagegIntro3', function(){
            // do something...
        });
    });
});