jquery fadeIn/Out el然后fadeIn/Out新el

Question

抱歉，标题请随意编辑，

总之，这是我到目前为止掌握的代码。

$('#foo').click(function() {

  $('#foo2').html('<h4>Please wait...</h4>').fadeOut('fast');

  var sful = $('#foo3').fadeIn('fast').html('<h4>Success!</h4>').fadeOut('slow');
  setTimeout(sful, 4000);

});

我试图在单击时将#foo2 2转到fadeIn，然后将其发送到fadeOut，然后将#foo2 3 (var sful)发送到fadeIn/Out。

Answer 1

$('#foo2').html('<h4>Please wait...</h4>').fadeOut('fast', function() {
  var sful = $('#foo3').fadeIn('fast').html('<h4>Success!</h4>').fadeOut('slow');
  setTimeout(sful, 4000);
});

回调 (function() { ..将在动画完成后运行)。请参阅http://api.jquery.com/fadeOut/ (特别是[,callback]部分)。

Answer 2

$('#foo2')
          .html('<h4>Please wait...</h4>')
          .fadeOut('fast', function() {  // callback start after fadeOut()
                             setTimeout(function() {
                                 $('#foo3')
                                       .fadeIn('fast')
                                       .html('<h4>Success!</h4>')
                                        .fadeOut('slow');
                              }, 4000);
                           });