Sección "Java Scripts"

Lección 63

Flash de palabras 

Este Script genera un excelente flash de palabras, para activarlo, pegas este código en donde dice <Body> en el HTML de tu página  (o sea, borras <Body>, y en ese lugar pegas este código):

<body bgcolor="#ffffff" scroll="no">

<!--

Quotation Scroller v1.0 by Angus Turnbull http://gusnz.cjb.net Updated: 15 Feb 2001
Secondary Redirect: http://www.bigfoot.com/~angus_rt

-->

<script>
<!-- // Hide

var isDOM = false, isNS4 = false;
if (document.all) var isDOM = true, docObj = 'document.all.', styObj = '.style';
else if (document.layers) var isNS4 = true, docObj = 'document.', styObj = '';

var quotes = new Array(); c = 0;
quotes[c] = 'Hola, beinvenidos a Webgasoleros!!!!'; c++;
quotes[c] = 'JavaScripts...'; c++;
quotes[c] = 'Sentencias HTML...'; c++;
quotes[c] = 'Ayuda a Webmasters'; c++;
quotes[c] = 'Sección para principiantes'; c++;
quotes[c] = 'Buscadores'; c++;
quotes[c] = 'Preguntas y respuestas'; c++;
quotes[c] = 'Como iniciarte en la construcción de una Web'; c++;
quotes[c] = 'La ventaja de un buen diseño'; c++;
quotes[c] = 'Atenciòn personalizada'; c++;
quotes[c] = 'Asistencia y ayuda en todos los niveles'; c++;
quotes[c] = 'Fondos e imagenes Gif'; c++;
quotes[c] = 'Retoque de imágenes'; c++;
quotes[c] = 'Diseño y elaboracón de Banners animados'; c++;
quotes[c] = 'Macromedia Flash'; c++;
quotes[c] = 'Sugerencias y consejos útiles'; c++;
quotes[c] = 'Página de inicio'; c++;
quotes[c] = 'Interacción y comunicación'; c++;

var visQuotes = 10; // Maximum onscreen at once.

var sDivSty = new Array(visQuotes);
var sDivRef = new Array(visQuotes);
var speed = new Array(visQuotes);

// Left: Low speed colours (lighter) .... Right: High speed colours (darker).
var colours = new Array('B2C7DE','A4BCD8','96B2D2','88A8CC','7A9EC6','6C94C0','5E89BA');


function checkDivs()
{
for (i = 0; i < visQuotes; i++)
{
// If it's moved offscreen to the left (or starting), set things in motion...
if (parseInt(sDivSty[i].left) < (0 - (isDOM ? sDivRef[i].clientWidth : sDivSty[i].clip.width)))
{
speed[i] = Math.floor(Math.random() * 56) + 8; // Varies: 8 to 63.
// Off to the right it goes.
sDivSty[i].left = (isDOM ? document.body.clientWidth : window.innerWidth) + Math.random() * 50;
// Write a quote in a colour that depends on the speed.

/* Stylesheets - guess which browser has bugs :)
*
* divText = '<nobr><span style="font: ' + speed[i] + 'px Arial, Helvetica; ' +
* 'color: #' + colours[Math.floor(speed[i] / 8) - 1] + '">' +
* quotes[Math.floor(Math.random() * quotes.length)] + '</span></nobr>';
*/

fontSize = Math.floor(speed[i] / 8) - 1;
divText = '<nobr><font face="Arial, Helvetica" size="' + fontSize + '" color="#' +
colours[fontSize] + '">' + quotes[Math.floor(Math.random() * quotes.length)] +
'</font></nobr>';

if (isDOM) sDivRef[i].innerHTML = divText;
if (isNS4)
{
sDivRef[i].document.write(divText);
sDivRef[i].document.close();
}
// Position and layer it according to its speed (faster = higher).
sDivSty[i].zIndex = speed[i];
topMax = (isDOM ? document.body.clientHeight : innerHeight) - speed[i];
sDivSty[i].top = topMax * Math.random();
}
// All items: Keep 'em moving left.
sDivSty[i].left = parseInt(sDivSty[i].left) - (speed[i] / 4);
}
}


function initDivs()
{
for (i = 0; i < visQuotes; i++)
{
divID = 'sDiv' + i.toString();
if (isDOM) document.write('<div id="' + divID + '" style="position: absolute; left: -1000">&nbsp;</div>');
// Have to use layers, divs are buggy as..... in NS. Again.
if (isNS4) document.write('<layer id="' + divID + '" left="-1000">&nbsp;</layer>');
sDivRef[i] = eval(docObj + 'sDiv' + i);
sDivSty[i] = eval(docObj + 'sDiv' + i + styObj);
}

setInterval('checkDivs()', 50);
}

if (isDOM || isNS4) initDivs();

// End Hide -->
</script>

<div id="mainText" style="position: absolute; left: 100; top: 200; z-index: 100">
<h1><font color="#8080C0">Hola amigos, diviértanse con los Webgasoleros</font></h1>
<div>

Lo que pinté con rojo corresponde al mensaje que sigue al cursor, lo puedes modificar a gusto.

 

Y aquí lo tienes al mismo archivo, listo para cortar y pegar en tu página:

Para ello haces click en cualquier palabra que se halla dentro de la caja, Te diriges a "Edición" en el menú superior de la barra de herramientas, e indicas "Seleccionar todo", luego tomas lo seleccionado dirigiéndote nuevamente a "Edición", pero esta vez indicas "Cortar", y posteriormente te posicionas en tu página, donde quieres colocar este código, entonces te diriges a Edición, y le indicas "Pegar". 

Si deseas hacer las cosas más rápido, puedes verificar en "Edición" (está escrito al lado de las palabras que indican cada orden) que pulsando "Control" + una letra determinada, puedes "seleccionar todo", "cortar" o "pegar" en forma instantánea y con eso evitas tener que ingresar constantemente al menú de "Edición".

Esto es lo que debes pegar debajo de donde dice <Body> en el HTML de tu página:

Si de todos modos, no funciona este efecto, corta el código HTML que debes colocar en tu página, pero antes de hacerlo, pégalo en tu Block de notas, y luego si córtalo de allí y pégalo en tu sitio. Ahora si no creo que haya ningún inconveniente que te impida disfrutar de este bonito efecto.

Recordemos que este Script también puede ser hallado en el programa Depósito, el cual puedes bajar de aquí: webtutorial.com.ar

Buena suerte.