Autor Tema: Cuenta atrás en segundos JavaScript. window.location redirecionar web CU01171E#  (Leído 4738 veces)

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Hola, otra solución por aquí. Ejercicio CU01171E del tutorial gratuito de programación JavaScript pdf de aprenderaprogramar.

Citar
EJERCICIO
Crea una página web que al ser invocada muestre un mensaje “Hemos cambiado de ubicación esta página. En breves momentos será redireccionado…” junto a una cuenta atrás que muestre 5, 4, 3, 2, 1 (correspondiente a 5 segundos). Tras transcurrir 5 segundos y mostrarse la cuenta atrás, el usuario debe ser redireccionada a la url http://aprenderaprogramar.com. Para realizar este ejercicio debes usar la propiedad window.location junto con funciones que permitan el retardo en la ejecución vistas en entregas anteriores del curso.

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
window.onload = function() {
setTimeout(cuentaAtras, 1000);
}
var contador = 5;
function cuentaAtras() {
document.getElementById('datos').innerHTML = 'Hemos cambiado de ubicación esta página. En breve será redireccionado... ' + contador;
document.getElementById('datos').style.fontSize = '66px';
if (contador==0) {
window.location.assign('http://aprenderaprogramar.com');
} else {
contador--;
setTimeout(cuentaAtras, 1000);
}
}
</script>
</head>
<body>
<div id="datos"></div>
</body>
</html>

Saludos.
« Última modificación: 22 de Junio 2018, 19:42 por Ogramar »

Mario R. Rancel

  • Administrador
  • Experto
  • ********
  • APR2.COM
  • Mensajes: 1978
    • Ver Perfil
Buenos días Pedro

Veo el código correcto. Como detalle que se puede mejorar, al cargar la página, el mensaje tarda 1 segundo en mostrarse debido a que cuando la página carga le estableces un setTimeout inicial con window.onload = function() { setTimeout(cuentaAtras, 1000); }

Para evitar esa demora en la carga veo preferible escribir window.onload = function() { cuentaAtras(); } quedando el retardo sólo para realizar la cuenta atrás, no para cargar el mensaje inicial.

Saludos

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Hola Mario, tienes razón, no había ninguna necesidad de retrasar el inicio de cuentaAtras().

Gracias por la apreciación, corregido queda.

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".