jQuery autohide elemento após 5 segundos

É possível ocultar automaticamente um elemento em uma página da web 5 segundos após o carregamento do formulário usando jQuery?

Basicamente, eu tenho

<div id="successMessage">Project saved successfully!</div>

que gostaria de desaparecer após 5 segundos. Eu olhei para a interface do usuário do jQuery e o efeito de ocultação, mas estou tendo um pouco de dificuldade para fazer com que funcione da maneira que desejo.

<script type="text/javascript">
        $(function() {
            function runEffect() {

                var selectedEffect = 'blind';

                var options = {};

                $("#successMessage").hide(selectedEffect, options, 500);
            };

            $("#successMessage").click(function() {
                runEffect();
                return false;
            });
        });
    </script>

Gostaria que a função de clique fosse removida e adicionasse um método de tempo limite que chame runEffect () após 5 segundos.

$(function() {
    // setTimeout() function will be fired after page is loaded
    // it will wait for 5 sec. and then will fire
    // $("#successMessage").hide() function
    setTimeout(function() {
        $("#successMessage").hide('blind', {}, 500)
    }, 5000);
});

Nota : Para fazer sua função jQuery funcionar dentro de setTimeout, você deve envolvê-la dentro

function() { ... }

$('#selector').delay(5000).fadeOut('slow');

Podes tentar :

setTimeout(function() {
  $('#successMessage').fadeOut('fast');
}, 30000); // <-- time in milliseconds

Se você usou isso, seu div ficará oculto após 30 seg. Eu também tentei este e funcionou para mim.

Observe que você pode precisar exibir o texto div novamente depois que ele desaparecer. Portanto, você também precisará esvaziar e reapresentar o elemento em algum ponto.

Você pode fazer isso com 1 linha de código:

$('#element_id').empty().show().html(message).delay(3000).fadeOut(300);

Se você estiver usando jQuery, você não precisa de setTimeout, pelo menos não para ocultar automaticamente um elemento.

Use setTimeout na função runEffect:

function runEffect() {
    setTimeout(function(){
        var selectedEffect = 'blind';
        var options = {};
        $("#successMessage").hide(selectedEffect, options, 500)
     }, 5000);
}

Eu acho que você também poderia fazer algo como ...

setTimeout(function(){
    $(".message-class").trigger("click");
}, 5000);

e fazer seus efeitos animados no evento-clique ...

$(".message-class").click(function() {
    //your event-code
});

Saudações,

jQuery (". success_mgs"). show (); setTimeout (function () {jQuery (". success_mgs"). hide ();}, 5000);

É assim que você pode definir o tempo limite após clicar.

$(".selectorOnWhichEventCapture").on('click', function() {
    setTimeout(function(){
        $(".selector").doWhateverYouWantToDo();
    }, 5000);
});

// 5000 = 5seg = 5000 milisec