Search code examples
jquerydelayfadeout

jquery replaceWith() and delay() to fadeOut()


I'm trying the following in order to replace existing element with the message and after a short delay fade out the message, but for some reason I cannot get it to work:

$(this).replaceWith($(message).hide().fadeIn(300).delay(1000).fadeOut(300));

Any idea how to amend the above to achieve exactly this?

As requested - a bit more of the code surrounding the line above:

$('#form_id').fadeOut(300, function() {
     $(this).replaceWith($(message).hide().fadeIn(300).delay(1000).fadeOut(300));
});

Solution

  • Ok - I've spent quite a bit of time trying to solve this and have come up with a different solution - for anyone who will come across the same problem - here's what I've done - simply using javascript setTimeout() function:

    tar.closest('#form_id').fadeOut(300, function() {
        $(this).replaceWith($(message).hide().fadeIn(300, function() {
             var elem = $(this);
             setTimeout(function() { 
                 elem.fadeOut(300);
             }, 1000);
        }));
    });