Jquery séquentielle fadeIn et FadeOut - même endroit

Question

J'ai trois images et je les aime à

Première image: fadeIn, attendez un certain temps, puis fadeOut; Deuxième image: (au même endroit) fadeIn, attendez un moment, puis fadeOut; Troisième image: (au même endroit) fadeIn, attendez un moment, puis fadeOut;

// faire quelque chose ...

J'ai cette stupidité jusqu'à présent.

$(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.location.replace("http://www.something.com"); 


     }); 

Puis-je avoir votre aide s'il vous plaît?

J'aimerais apprendre comment faire ceci, sans un plugin spécifique ...: D "Je manque de temps, donc, je vais utiliser le plugin suggéré car, ce n'est vraiment rien de spécial."

Merci à l'avance, MEM

Answer 1

On dirait que vous êtes sur la bonne voie pour faire défiler des images. Cependant, il n'y a rien dans votre description qui semble être une exigence spéciale. Par conséquent, je recommande fortement le jQuery Cycle plugin.

Si vous voulez le faire vous-même, mettez à jour votre OP.

Answer 2

Ce que vous voulez faire est d'utiliser des rappels pour ce faire. Vous vous retrouvez avec une chaîne plutôt moche, mais ça marche. Cela ressemblerait à quelque chose comme ceci:

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... 
     }); 
    }); 
});