Título de página animado
Curioso efecto para animar el títle de la página web, o sea, el t´tiulo que aparece en la barra superior del navegador cuando accedemos a ella.
En este ejemplo el título se convierte en un carrusel: va pasando de derecha a izquierda continuamente.
Solución
<script>
function animaTitulo(ini) {
if (ini){
document.title = document.title.replaceAll(" ","\xA0")+"-";
ini = false;
}
var actual = document.title;
var ind;
if(actual[0]=="\xA0")
ind=2;
else
ind=1;
sp = actual.substring(0, ind);
document.title = actual.substr(ind)+sp;
setTimeout(animaTitulo, 220,ini);
}
</script>
<body onload="animaTitulo(true)">
<p>Contenido de la página</p>
</body>
Explicación
Este ejemplo ilustra el uso de un temporizador en Javascript para animar el título de la página (el que aparece en la barra superior del navegador)
Este temporizador llama a la función animaTitulo(sp) a intervalos regulares. La función lleva un argumento para indicar si es la primera llamada, en cuyo caso se cambian los espacios por non break spaces y se añade un guión al final para marcar el fin del título.
En cada llamada la función mueve la inicial del título a la posición final. Si es un espacio se agrega el espacio y la letra siguiente, esto es necesario para que el flujo del títiulo sea vea más uniforme.
Como lo uso
Bien fácil. Primero le ponemos un títiulo a la página (<title>Mi página animada</title>). Luego en la etiqueta body asociamos el evento load a la función animaTitulo(true). Como es la primera llamada se debe llamar con el argumento en true.
Esta página tiene este efecto en la barra de título como ves.