image
Inicio » Javascript » Artículos » Scroller para la barra de estado




Scroller para la barra de estado

 
Por Fernando J. Pereda
Artículos publicados: 1
Valoración media: 3.59/5
Usuario desde: 05/05/2003

Determinar las variables de la aplicación

Lo primero que debemos hacer nada más ver qué es lo que hará nuestro programa, debemos determinar las variables que vamos a usar; en nuestro caso nosotros lo que queremos es que un texto vaya de un lado a otro de la barra de estado, pues entonces, la primera variable que vamos a necesitar será una que guarde el mensaje. Después, otra de las variables que más saltan a la vista, es la de la velocidad de retardo del scroll, y también el ancho del scroller, por lo tanto tendremos tres variables que vamos a utilizar para configurar nuestro script:

var mensaje = "* WEBESTILO.COM *";
var velocidad = 25;
var ancho = 50;

Determinar el método que se va a usar

Bueno, en esta parte del script debemos determinar la forma de mover el texto de un lado a otro, y la forma de hacerlo, será poniendo delante de la variable mensaje una variable que contenga tantos espacios como el ancho de la barra, pero para que "eso se mueva", tenemos que usar un contador, y añadir delante de mensaje una subcadena de una variable delante ( por ejemplo ) desde el principio, contador:

var delante = "";
var cnt = 0;

for ( var i = 0 ; i < ancho-mensaje.length ; i++ )
   delante += ' '; 

Determinar el número de funciones y desarrollarlas

Está claro que en este script, vamos a usar dos funciones aunque se podría usar solo una, pero es más cómodo e igual de rápido usar dos, una que mueva el texto hacia la derecha y otra que lo mueva hacia la izquierda. Pero antes debemos declarar una variable más que nos ahorrará quebraderos de cabeza y que luego no entendamos nuestro código, se usará para guardar la información a mostrar ( ej.: muestra ):

var muestra, max = ancho-mensaje.length; 
La primera función sería de la siguiente manera: 
function derecha() 
{ 
   if ( cnt == 0 ) 
   { 
      muestra = mensaje; 
      setTimeout("derecha()", velocidad); 
   } 
   if ( cnt >= 1 ) 
   { 
      muestra = delante.substring(0,cnt) + mensaje; 
      setTimeout("derecha()", velocidad); 
   } 
   if ( cnt == max ) 
   { 
      cnt = -2; 
      setTimeout("izquierda()", velocidad); 
   } 
   cnt++; 
   window.status = muestra; 
} 

En el primer if, lo que se comprueba es si el mensaje está al principio de la barra de estado, entonces se muestra el mensaje tal cual y se llama otra vez a la misma función con un retardo de tiempo igual a velocidad. En el segundo, se comprueba si cnt es distinto de 0, y se muestra una subcadena de delante que va desde el principio de delante hasta la posición cnt y mensaje; y por último se vuelve a llamar a la función derecha con el retardo de tiempo equivalente a tiempo.

muestra = delante.substr(0,cnt) + mensaje;
setTimeout("derecha()", velocidad); 

En la tercera condición se evalúa si el texto está al final, en cuyo caso se llamaría a la función izquierda que es la segunda función de nuestro script. Y la segunda función sería algo así:

function izquierda() 
{ 
   if ( cnt == 0 ) 
   { 
      muestra = delante + mensaje; 
      setTimeout("izquierda()", velocidad); 
   } 
   if ( cnt >= 1 ) 
   { 
      muestra = delante.substring(0,(max-cnt)) + mensaje; 
      setTimeout("izquierda()", velocidad); 
   } 
   if ( cnt == max ) 
   { 
      cnt = -2; 
      setTimeout("derecha()", velocidad); 
   } 
   cnt++; 
   window.status = muestra; 
} 

Esta función hace prácticamente lo mismo que la anterior a excepción de la segunda condición, en la cual la subcadena que se pone delante de mensaje se construye desde 0 hasta max-cnt, es decir cada vez uno menos en lugar de una más. Sólo queda inicializar el script mediante una llamada a derecha() o a izquierda(), si quieren ver el script en funcionamiento, pulsen en el siguiente botón:


Fecha publicación: 04/01/2003


Más artículos

Valoración

Este artículo ha sido valorado 421 veces. Valor:  [3.59/5]   
Malo------>Normal----->Bueno
                   

Comentarios

Añadir un comentario

Si no está de acuerdo con algo o quiere añadir más información al respecto puede incluirla añadiendo un comentario.

Nombre:
E-Mail: (opcional)
Los comentarios son moderados, no aparecen inmediatamente, son leídos por el administrador y publicados según el interés para otros lectores.

Se reserva el derecho de publicación de los comentarios introducidos.

Colabora

¿Te sientes capacitado para escribir un artículo como este? ¿Te gustaría colaborar escribiendo artículos en WebEstilo? Háznoslo saber !!









Comparte



Última modificación:31 de Agosto de 2017. Spain - Espa�a.
© 1998-2004 por . Todos los derechos reservados.