1

Tengo la siguiente línea que me emite un mensaje de éxito mediante un div, pero algunas penas alcanzo leer el mensaje.

$('.message').html(textStatus).delay(60000).fadeOut(60000);
location.href = 'exito.php';},60000);

A diferencia de location.href = 'exito.php';},60000); que redirecciona en un minuto.

Agrego el mismo valor:

$('.message').html(textStatus).delay(60000).fadeOut(60000);

Pero el mensaje se oculta en menos de 7 segundos.

¿Cómo puedo cambiar el retraso que se desaparezca el mensaje por 30 segundos o aun minuto? Al igual que el location que sí funciona correctamente.

1 respuesta 1

1
+50

Mira puedes usar algo como esto

$('#Mensaje').html("HOLA"); //SETEO EL TEXTO EN EL OBJETO
setTimeout(function(){ //INICIO UN RELOJ DE 3 SEGUNDOS
    $('#Mensaje').fadeOut("fast"); //OCULTO EL MENSAJE
},3000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="Mensaje"><div>

Mas info setTimeout https://www.w3schools.com/jsref/met_win_settimeout.asp

El Valor 3000 Son los segundos = 3

30000 Serian los 30 segundos

Aunque haciendo pruebas tu código también funciona bien, en este ejemplo espera 30 segundos para ocultar el mensaje

$(".Mensaje")
.html("HOLA") //SETEO EL HTML
.delay(30000) //ESPERO 30 SEGUNDOS
.fadeOut("fast"); //OCULTO
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="Mensaje"></div>

Mas info delay https://api.jquery.com/delay/

Mas info fadeout http://api.jquery.com/fadeout/

También te dejo un ejemplo con el que puedes jugar un poco con el tiempo

var segundos=0;
function Contador(){
    $("#Contador").text(segundos/1000);
    if(segundos>0){
        setTimeout(function(){
            segundos-=1000;
            Contador();
        },1000);
    }else{
    	$("#Contador").text("");
    }
}
$("#Iniciar").click(function(){
    segundos=$("#Tiempo").val();
    var rs=segundos;
    Contador();
	$(".Mensaje").show()
        .html("HOLA")
        .delay(rs)
        .fadeOut("fast");
});    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input id="Tiempo" placeholder="Tiempo" value="3000">
<button id="Iniciar">Iniciar conteo para ocultar</button>
<div id="Contador"></div>
<div class="Mensaje"></div>

Saludos :)

4
  • Hola, y el .delay() para que sirve?
    – Otto
    el 8 sep. 2018 a las 6:08
  • @RuberHernandez De esta manera no funciona .delay(60000).fadeOut(60000); el procedimiento realizado que ocasiona, porque desaparece en menos de 7 segundos.
    – Otto
    el 8 sep. 2018 a las 6:10
  • Si te fijas en el segundo snippet si lo hace correctamente, voy a cambiar el tiempo a 30 segundos para ver el efecto, en el tiempo de desaparición también pones 1 minuto; tardara 1 minuto en desvanecer el texto aparte del minuto que pones del delay fadeOut(60000); el 8 sep. 2018 a las 6:12
  • Funciona perfectamente, por mi parte te acreditare la recompensa :) esperemos el SO, valide su respuesta como correcta, Saludos :)
    – Otto
    el 9 sep. 2018 a las 0:53

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.