M 4 T 1 1 - Como crear un menú en scroll

1-Lo primero que les mostrare es el código y luego les diré las partes modificables de dicho código así que lo pueden copiar y pegar en el block de notas o donde les quede mas fácil, pero creo que mas fácil que el block de notas no hay, así que copienlo y péguenlo, para que luego puedan hacer sus modificaciones, este será el código para colocar en su scroll solo frases que vayan subiendo o bajando según lo elijan Uds., he modificado el menú para 4 opciones así que escojan cual quieren o cual les gusta o cual necesitan, mejor dicho entre gustos no hay disgustos jejejje, así que este código que sigue solo es para que vayan pasando frases hechas por Uds. en una especie de cajita en la posición donde quieran que se vaya a ver......

document.write('<marquee id="iescroller" direction="up" width="250" height="75" scrollamount="2" scrolldelay="100" style="border:3 solid red;background-color:black">');iescroller.onmouseover=new Function("iescroller.scrollAmount=0");iescroller.onmouseout=new Function("iescroller.scrollAmount=2");document.write('<font size="3" face="Monotype corsiva" color="Yellow">')document.write('<Div align="center">AQUI FRASES QUE SE VERAN</div><br><br>');document.write('<Div align="center">AQUI FRASES QUE SE VERAN</div><br><br>');document.write('<Div align="center">AQUI FRASES</div><br><br>');document.write('<Div align="center">AQUI MAS FRASES</div><br><br>');document.write('</font>');document.write('</marquee>');</script>

2-Muy bien ahora vamos con el segundo código que será para colocar solo imágenes en vez de frases, o sea para que se vean solo imágenes subiendo o bajando en el menú, según Uds. elijan, porque como ya les dije, este código se puede modificar a nuestro gusto. ahí va el segundo código, para que se vean solo imágenes, me falta decirles que aquí en este código, deben ajustar el tamaño de sus imágenes para que sea igual al menú, me explico:por ejemplo este menú en su código dice que tiene un ancho(widht) de 200 x un alto(heigth) de 75px, pues deben usar imágenes de ese mismo tamaño para que no se salga de su menú y queden las imágenes perfectamente alineadas.

document.write('<marquee id="iescroller" direction="up" width="250" height="75" scrollamount="2" scrolldelay="100" style="border:3 solid red;background-color:black">');iescroller.onmouseover=new Function("iescroller.scrollAmount=0");iescroller.onmouseout=new Function("iescroller.scrollAmount=2");document.write('<font size="3" face="Monotype corsiva" color="Yellow">')document.write('<Div align="center"><img src="AQUI LA URL DE LA IMAGEN"/></div><br><br>');document.write('<Div align="center"><img src="AQUI LA URL DE LA IMAGEN"/></div><br><br>');document.write('<Div align="center"><img src="AQUI LA URL DE LA IMAGEN"/></div><br><br>');document.write('<Div align="center"><img src="AQUI LA URL DE LA IMAGEN"/></div><br><br>');document.write('</font>');document.write('</marquee>');</script>

3-Sigamos con la tercera opción, que es colocar links (urls,enlaces,paginas) en forma de texto y al pasar el mouse por encima de alguno de estos textos, se pare y podamos dar clic en el, para que nos lleve a la pagina enlazada en dicho texto, ahí va.....

document.write('<marquee id="iescroller" direction="up" width="250"

height="75" scrollamount="2" scrolldelay="100" style="border:3 solid

red;background-color:black">');

iescroller.onmouseover=new Function("iescroller.scrollAmount=0");

iescroller.onmouseout=new Function("iescroller.scrollAmount=2");

document.write('<font size="3" face="Monotype corsiva"

color="Yellow">')

document.write('<Div align="center"><a href="AQUI URL DE TU LINK">AQUI NOMBRE QUE SE VERA DEL LINK</a></div><br><br>');

document.write('</font>');

document.write('</marquee>');

</script>

4-Ok ya este es el ultimo código, se trata de colocar imágenes que sirvan de link, o sea que al pinchar en ellas te lleven a determinada pagina.....

document.write('<marquee id="iescroller" direction="up" width="250"

height="75" scrollamount="2" scrolldelay="100" style="border:3 solid

red;background-color:black">');

iescroller.onmouseover=new Function("iescroller.scrollAmount=0");

iescroller.onmouseout=new Function("iescroller.scrollAmount=2");

document.write('<font size="3" face="Monotype corsiva"

color="Yellow">')

document.write('<Div align="center"><a href="AQUI URL DEL SITIO" target="_blank"><img src="AQUI LA URL DE LA IMAGEN"</a></div><br><br>');

document.write('</font>');

document.write('</marquee>');

</script>

Muy bien , ya tenemos las 4 opciones o los 4 códigos, así que ahora les diré que partes de esos códigos son modificables a nuestros gustos:

1-Donde dice "dirección="up", lo podemos cambiar el "up" por "down", que quiere decir eso? pues que nuestros enlaces o imágenes podrán ir o para arriba(up) o para abajo(down)segun lo elijamos.

2-Donde dice "widht"250 y "heigth"75, es su tamaño , o sea aquí puedes modificarle el tamaño.width=ancho y height=alto.

3-Donde dice "scrollamount"=2, quiere decir la velocidad con que salen, los links, los textos o las imágenes, así que entre mas alto coloques ese numero el 2 mas rápido saldrán tus links, etc.

4-Donde dice style="border:3 solid red,aqui puedes cambiarle el tamaño del borde y el color.

5-Donde dice background-color:black, aquí es el color de fondo de tu menú, recuerda si lo vas a cambiar, escribe el color en ingles.

6-Donde dice document.write('<font size="3" face="Monotype cursiva"
color="Yellow">'). aquí puedes cambiarle el tipo de letra a las frases o enlaces, también puedes modificarle el tamaño(size)de la letra y también puedes cambiarle el color, recuerda escribir el color en ingles.

Muy bien amigos eso es todo, no es tan difícil como parece, además es muy divertido crear tus propios menús, espero les sirva de ayuda este tuto y puedan hacer sus creaciones mas fácil con esta ayuda. Hasta pronto.

Ah recuerden, deben copiar estos códigos siempre en edición HTML para que funcionen correctamente, y les digo de nuevo, estos códigos solo funcionan con IExplorer y con Opera, no funcionan con Mozilla