|
Conceptos básicos de guionización |
|
|
Desplegando mensajes en movimiento en la barra de status | |
|
El siguiente ejemplo nos mostrará cómo crear una pancarta de texto en movimiento en la barra de status que desplegará un mensaje deseado. ¿Cómo funciona? El JavaScript se coloca entre las etiquetas <HEAD> ... El coóigo va aquí ... </HEAD> Es un guión muy sencillo, al principio del programa se definen dos variables para controlar la velocidad entre pasadas del texto:
Después se define la función SetupTicker() que contiene la variable que contendrá el mensaje msg que en un principio tiene una cadena con espacios, después se le concatena (msg += "mensaje añadido") la primer parte del mensaje y en una segunda concatenación se pone la parte final del mensaje. Al final de la función se hace una llamada a la función RunTicker(). La función RunTicker() ajusta la propiedad status del objeto window (es decir, cambia el mensaje, especifica el mensaje) mediante el método setTimeout que toma dos valores, una expresión a evaluar después de un tiempo en milisegundos. En nuestro caso, setTimeout('RunTicker()', ScrollSpeed), es decir se evalúa así misma después del valor que tome ScrollSpeed, lo que pasa después es que el valor de la cadena msg se altera con los métodos substring para ir 'moviendo' el texto. | |
|
Desplegador de mensajes en movimiento |
Manejador de eventos: onMouseOver |
|
Aquí está el código: <SCRIPT LANGUAGE="JavaScript">
<!--
// Status-line ticker by Dave Methvin, Windows Magazine
// May be used/modified if credit line is retained
// CHANGE THESE TO ALTER THE SCROLL SPEED
ScrollSpeed = 100; // milliseconds between scrolls
ScrollChars = 2; // chars scrolled per time period
function SetupTicker() {
// add space to the left of the message
msg = " . . . ";
// PUT YOUR MESSAGE HERE, USE += TO ADD THEM TOGETHER
msg += "Tutorial de JavaScript, http://dch.mty.itesm.mx/ciete/javascript/, ";
msg += "todo acerca de JavaScript!";
// this starts the ticker
RunTicker();
}
function RunTicker() {
window.setTimeout('RunTicker()',ScrollSpeed);
window.status = msg;
msg = msg.substring(ScrollChars) + msg.substring(0,ScrollChars);
}
// Start the ticker code
SetupTicker();
<!-- end -->
</SCRIPT>
| |