Lección completa de marquesina de texto.
Marquesina= una marquesina son una(s) palabra(s) que se mueve o sea que digamos: un texto aparece en la derecha de la pantalla y se va moviendo a la izquierda, y cuando llega al final de su rumbo el texto empieza a desaparecer. Y aquí explicaremos absolutamente todo sobre como funcionan las marquesinas
Bueno, en primer lugar enseñaremos las 2 etiquetas basicas de marquesina, la marquesina normal(de derecha a izquierda) y la marquesina que rebota.
-Marquesina normal:
| Código: |
| <marquee>texto aquí</marquee> |
-Marquesina que rebota:
| Código: |
| <marquee behavior=alternate>Texto aquí</marquee> |
Bueno esos son vastante basicos, pero ahora voy a enseñar como colocar muchos mas efectos a este genial codigo html.
-Como hacer que controlemos la cantidad de espacios que se salta la marquesina:
| Código: |
| <marquee scrollAmount="1">Texto aki</marquee> |
-Luego, si queremos controlar el tiempo que se salta esos espacios, seria:
| Código: |
| <marquee scrollAmount="1" scrolldelay="100">texto aki</marquee> |
Los "100" son los milisegundos.(P.D=100 milisegundos=1 segundo)
-Controlar desde donde hasta donde la marquesina:
| Código: |
| <marquee width=50% height=80 ALIGN=BOTTOM>texto aki</marquee> |
P.D= este codigo se puede colocar los numeros en % o pixeles(el "80" es el pixele.)
-Colocar un fondo a colo a la marquesina:
| Código: |
| <marquee bgcolor="AA0000">texto aki</marquee> |
P.D= este codigo se controla a travez del codigo del color, o sea el color que dice hay es: rojo oscuro.
-Controlar direccion:
| Código: |
| <marquee direction="up">este texto esta en direccion hacia arriba</marquee> |
P.D= las direcciones tienen que estar en ingles.
Bueno creo que eso a sid todo en cuanto al codigo de marquesina, pero el tutorial continua, ya que la marquesina se pude fuionar con otros codigos html!
-Controlar la fuente de la marquesina:
| Código: |
| <font face="Arial"><marquee>texto aki</marquee></font> |
P.D= la fuente tiene que ser escrita al 100% correcta para que funcione.(aunk no comprobado lo de mayusculas)
-Colocar color al texto de la marquesina:
| Código: |
| <font color=#FFFFFF><marquee>Esto texto seria colo blanco</marquee></font> |
-Aliniar al Centro de una pagina la marquesina de abajo-arriba o arriba-abajo:
| Código: |
| <div align="center"><marquee direction="up">texto esta centrado y llendo hacia arriba</marquee></div> |
P.D= este codigo donde dice: "center" se puede modificar para que sea a la izquierda o derecha de algo.(digo de alguna pagina o box.)
Bueno Aquí voy a agregar mas cosas que sean utiles para la marquesina de texto, y ademas voy a colocar un codigo de un texto que persiga a raton.
Text que persigue al raton:
| Código: |
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
if (document.all) {
//Escribe aquí el texto que quieres
yourLogo = ""F" te ayuda con la marquesina"; //Más de 2 letras
logoFont = "Verdana";
logoColor = "336699";
//No tienes que modificar nada mas
yourLogo = yourLogo.split('');
L = yourLogo.length;
TrigSplit = 360 / L;
Sz = new Array()
logoWidth = 100;
logoHeight = -30;
ypos = 0;
xpos = 0;
step = 0.03;
currStep = 0;
document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < L; i++) {
document.write('<div id="ie" style="position:absolute;top:0px;left:0px;'
+'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'
+'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>');
}
document.write('</div></div>');
function Mouse() {
ypos = event.y;
xpos = event.x - 5;
}
document.onmousemove=Mouse;
function animateLogo() {
outer.style.pixelTop = document.body.scrollTop;
for (i = 0; i < L; i++) {
ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180);
ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180);
Sz[i] = ie[i].style.pixelTop - ypos;
if (Sz[i] < 5) Sz[i] = 5;
ie[i].style.fontSize = Sz[i] / 1.7;
}
currStep -= step;
setTimeout('animateLogo()', 20);
}
window.onload = animateLogo;
}
// End -->
</SCRIPT> |
Como colocar banner's de marquesina de derecha a izquierda :
| Código: |
| <marquee><a href=" url de la web deseada"><img src="url del bane aquí"></a></marquee> |
Como colocar bannr's en marquesina de abajo asia arriba(un buen ejemplo es el que esta e mi web.):
| Código: |
| <marquee direction="up"><a href=" url de la web deseada"><img src="url del bane aquí"></a></marquee> |
P.D= estos codigos con el banner(o sea el derecha-izquierda y abajo-arriba tambien se le pueden pueden sustituir con url's normales.o sea en vez del codigo de una imagen, colokamos algo asi como:"Has click aki y entra a..." ademas de que hora les voy a decir una muy buena forma de controlar la marquesina asu favor.
Como controlar la marquesina muy facilmente:
En Pagina Web Gratis en "controlar paginas" agrega una nueva pagina en blanco, luego agrega lo que kieres conlocar e la marquesina(pero sin html, normalmente como si escribieras) y ve agregando color o cosas asi con los botones de arria, una vez terminado todo lo que quieras(o sea en algunas partes con color, o algunas partes con negrita, etc...) activa ahora el boton "HTML" entonces te va a aparecer el codigo de lo que has hecho.
Copia el codigo y fucionalo con las marquesinas que ya te e enseñado anteriormete.
Esta es una muy buena forma de hacer marquesinas para las personas que no saven de HTML, ya que digamos que una persona lee este psot pero kiere agregarle color banco al texto y en alguna otra parte color verde, entonces esa persona no sabra que hacer, entonces usando la tecnica que acado de enseñar para controlar el texto, podra facilmente hacer lo que el kiere.
Y recuerden, este tutorial lo hizo manualmente "F" visiten mi web si quieren ver ejemplo de la marquesina alianada al centro en box y de abajo~arriba.
Adiós!
GRACIAS FANSDEATHNOTE POR DONAR LOS CODIGOS A MI PAGINA!
