Texto de Colores con JavaScript |
|
|
Con el siguiente ejemplo conseguirás un efecto 'arco iris' sobre cualquier texto. Tanto los colores como el texto los puedes cambiar modificando el texto en negrita.
<html>
<head>
<title> Efecto1 </title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript1.2">
<!--
function initArray() {
this.length = initArray.arguments.length;
for (var i = 0; i < this.length; i++) {
this[i] = initArray.arguments[i];
}
}
var texto = " El texto cambia de colores!! ";
var velocidad = 1000 ;
var x = 0;
var color = new initArray("red", "#FF9900", "green", "blue");
if(navigator.appName == " Netscape ") {
document.write('<layer id="c"><center>'+texto+'</center></layer><br>');
}
if (navigator.appVersion.indexOf(" MSIE ") != -1){
document.write('<div id="c"><center>'+texto+'</center></div>');
}
function cambiacolor() {
if(navigator.appName == "Netscape") {
document.c.document.write('<center><font color="'+color[x]);
document.c.document.write('">'+texto+'</font></center>');
document.c.document.close();
}
else if (navigator.appVersion.indexOf("MSIE") != -1){
document.all.c.style.color = color[x];
}
(x < color.length-1) ? x++ : x = 0;
}
setInterval(" cambiacolor() ", velocidad );
//-->
</script>
</body>
</html>
|
También puedes añadir más colores a los que tiene el ejemplo. Para ello solo tienes que alargar la cadena del Array: new initArray("red", "#FF9900", "green", "blue", "black", "#666666", "#FF00FF" ) y así con todos los colores que quieras añadir.
En la variable velocidad , puedes indicar el tiempo que tarda en pasar de un color a otro. Si lo dejas tal como está ahora, ese tiempo es de 1 segundo ( 1000 milisegundos ), pero el efecto es mucho más atractivo si bajas esa cantidad a por ejemplo 100 milisegundos.
Original de fuikas.tk
|