Título: Añadir Estilo a javascript en HTML :: Ayuda Porfavor
Publicado por: Cyber-Cyclop en 2 Noviembre 2012, 05:57 am
Bueenaas, espero que todos estén muy bien...
Pues estaba haciendo un documento en HTML en el que usaba javascript para hacer un efecto con el texto: que cada letra se fuera escribiendo poco a poco. El código es éste:<html>
<script type="text/javascript">
function showIt(){
setTimeout('document.write("<LETTER>");', 100)
setTimeout('document.write("<br />");', 100)
setTimeout('document.write("H");', 100)
setTimeout('document.write("e");', 300)
setTimeout('document.write("l");', 400)
setTimeout('document.write("l");', 500)
setTimeout('document.write("o");', 600)
setTimeout('document.write(",");', 700)
setTimeout('document.write(" ");', 800)
setTimeout('document.write("m");', 900)
setTimeout('document.write("y");', 1000)
setTimeout('document.write(" ");', 1200)
setTimeout('document.write("n");', 1300)
setTimeout('document.write("a");', 1400)
setTimeout('document.write("m");', 1500)
setTimeout('document.write("e");', 1600)
setTimeout('document.write(" ");', 1700)
setTimeout('document.write("i");', 1800)
setTimeout('document.write("s");', 1900)
setTimeout('document.write(" ");', 2000)
setTimeout('document.write("-");', 2100)
setTimeout('document.write("-");', 2200)
setTimeout('document.write("-");', 2300)
setTimeout('document.write("-");', 2400)
setTimeout('document.write(".");', 2500)
setTimeout('document.write("<br />");', 2600)
setTimeout('document.write("T");', 2700)
setTimeout('document.write("h");', 2800)
setTimeout('document.write("i");', 2900)
setTimeout('document.write("s");', 3000)
setTimeout('document.write(" ");', 3100)
setTimeout('document.write("i");', 3200)
setTimeout('document.write("s");', 3300)
setTimeout('document.write(" ");', 3400)
setTimeout('document.write("m");', 3500)
setTimeout('document.write("y");', 3600)
setTimeout('document.write(" ");', 3700)
setTimeout('document.write("f");', 3800)
setTimeout('document.write("i");', 3900)
setTimeout('document.write("r");', 4000)
setTimeout('document.write("s");', 4100)
setTimeout('document.write("t");', 4200)
setTimeout('document.write(" ");', 4300)
setTimeout('document.write("J");', 4400)
setTimeout('document.write("a");', 4500)
setTimeout('document.write("v");', 4600)
setTimeout('document.write("a");', 4700)
setTimeout('document.write("S");', 4800)
setTimeout('document.write("c");', 4900)
setTimeout('document.write("r");', 5000)
setTimeout('document.write("i");', 5100)
setTimeout('document.write("p");', 5200)
setTimeout('document.write("t");', 5300)
setTimeout('document.write(".");', 5400)
setTimeout('document.write("<br />");', 5500)
setTimeout('document.write(":");', 5600)
setTimeout('document.write(")");', 5700)
}
</script>
<title>
Hello.
</title>
<body
style="background-color:black; font-family:'Lucida Console'; font-size:16px; color:cyan;">
<br>
<br>
<br>
<br>
<br>
<center>
Press "Start" to Play!
<br>
<br>
<input type="button" value="Start" onClick="showIt()" style="height: 25px; width: 100px; font-family:'Lucida Console'; font-size:14px;"></input>
</center>
</body>
</html>
Entonces lo que hace es, presionas el botón y comienza el script, pero todo el "style" que tenía, desaparece.
Mi duda es entonces, cómo hacer que el mismo "style" aplique también para cuando se está ejecutando el script, osea que este el fondo negro con las letras cyan y que se vaya escribiendo el texto poco a poco.
Pues es eso, muchas gracias
PD: Es la primera vez que creo un tema así que les pido mis más sinceras disculpas si puse el tema en un foro equivocado o si lo hice mal, gracias por su comprensión.
Título: Re: Añadir Estilo a javascript en HTML :: Ayuda Porfavor
Publicado por: peib0l en 3 Noviembre 2012, 01:35 am
Ejecuta el javascript dentro de un <div class=""></div> y aplica el estilo del texto a ese div exclusivamente. javascript setTimeout('document.write("<div class=\"nombre_de_clase\">");', 100)
setTimeout('document.write("<div/>");', 5700)
CSS .nombre_de_clase{
color: cyan; //prueba el "tomato"
font-family:'Lucida Console';
font-size:16px;
}
|