Rincón JavaScript
1. Para que tu formulario de correo llegue en forma “legible”
2. Abrir otra página en una nueva ventana
3. Abrir otra página en la misma ventana (Actualización de la página)
4. Texto en movimiento en la barra de estado
5. Cerrar ventana con un botón
6. Cerrar ventana con texto
7. Cambiar el color de la barra de desplazamiento
8. Agregar a favoritos (con texto)
9. Hacer de tu web la página de inicio
10. Quitar el subrayado automático a los links de texto
11. OnLoad
12. Ventana PopUp
13. Un banner sencillo
14. Agregar un botón “Imprimir”
15. Un menú desplegable
16. Colocar la fecha actual automaticamente
1. Para que tu formulario de correo llegue en forma comprensible:
<form method="post" action="mailto:direccion@correo" enctype="text/plain">
(Este correo saldrá de todos modos por Outlook. Es inevitable. Si querés que salga directo desde la página deberás usar algún CGI. Nosotros usamos php.)
2. Abrir otra página en una nueva ventana:
<script>
nuevaUrl='http://www.otro_sitio.com/inicio.htm'
nuevaWin='_blank'
nuevoTime=12000
setTimeout("open(nuevaUrl,nuevaWin)",nuevoTime);
</script>
3. Abrir otra página en la misma ventana (Actualización de la página):
<script language="JavaScript">
setTimeout("location='http://javascript/'",2500)
</script>
** Lo colocas en HEAD o mejor aún lo activas con un onload, para asegurarte que se ha cargado la página de introducción **
<meta http-equiv="refresh" content="12; URL=http://sitio.com/">
4. Texto en movimiento en la barra de estado:
<script LANGUAGE="JavaScript">
/<-Start of scroller script/
var scrollCounter=0;
var scrollText = "tu_mensaje";
var scrollDelay=200;
var i=0;
while(i++<140)
scrollText=""+scrollText;
function Scroller()
{
window.status =
scrollText.substring(scrollCounter++);
scrollText.length;
if(scrollCounter==scrollText.length)
scrollCounter=0;
setTimeout("Scroller()",scrollDelay);
}
Scroller();
//End of scroller script->
</script>
5. Cerrar ventana con un botón:
<form>
<p>
<input type="button"
value="Cerrar esta ventana"
onclick="window.close();">
</p>
</form>
6. Cerrar ventana con texto:
<p align="center" style="line-height: 100%; margin-top: 3; margin-bottom: 3"><font face="Verdana" size="1"><b>==============<a href="" onclick="window.close() ;"><br>
CERRAR VENTANA<br>
</a>==============</b></font>
</p>
7. Cambiar el color de la barra de desplazamiento:
<style type=text/css>
body {scrollbar-face-color:#000000;
scrollbar-highlight-color:#808080;
scrollbar-shadow-color:#ffffff;
scrollbar-3dlight-color:#808080;
scrollbar-arrow-color:#808080;
scrollbar-track-color:#808080;
scrollbar-darkshadow-color:black
}
</style>
8. Agregar a favoritos (con texto):
<SCRIPT language="Javascript">
function agregar(){
if ((navigator.appName=="Microsoft Internet Explorer") &&
(parseInt(navigator.appVersion)>=4)) {
var url="http://www.tu-sitio.com/";
var titulo="Nombre del Sitio";
window.external.AddFavorite(url,titulo);
} else {
if(navigator.appName == "Netscape")
alert("Presione Crtl+D para agregar este sitio en sus Bookmarks");
}
}
</SCRIPT>
<a href="javascript:agregar()">Agregar a favoritos</a>
9. Hacer de tu web la página de inicio:
<p>
<a class="chlnk" href onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.tusitio.com.ar');" style="CURSOR: hand"><font color="#808080" size="1" face="Arial">Háganos
su web de inicio<br>
</font></a>
</p>
</body>
10. Quitar el subrayado automático a los links de texto:
<style type="text/css">
a {
text-decoration: none;
}
</style>
11. OnLoad (ej. Para abrir una ventana relacionada cuando se visita tu sitio, transcurrido un tiempo determimnado):
onload se refiere al evento que se produce al cargar la página web.
<body onload="funcion()">
Tras cargarse la página.
<body onload="abreDelay()">
donde abreDelay() es la función con el setTimeout
function abreDelay()
{
setTimeout("location='http://espaciolatino.com/'",2500)
}
12. Ventana PopUp:
<SCRIPT LANGUAGE="JavaScript">
open('http://enlace para abrir', 'Sizewindow', 'width=200,height=100,scrollbars=no,toolbar=no')
</SCRIPT>
13. Un banner sencillo:
<body onload="resetear(10, 48, 10, 'letras')">
<DIV id="letras" style="position:absolute; font-size:10px; height:56px; width: 761px; background-color: #CCFFCC;border: 1px none #000000;">Toda la frase va creciendo</DIV>
<p> </p>
<p> </p>
<p>Y qué pasa con el resto </p>
</body>
//Mas en: http://javascript.espaciolatino.com/
<script language="JavaScript">
var banZoom = null
function creceLetra()
{
var obj = banZoom
var tma
tma = parseInt(obj.style.fontSize)
window.status = obj.style.fontSize
if (tma<obj.maxTam)
{
obj.style.fontSize = tma + 1
setTimeout("creceLetra("+obj.maxTam+")",20)
}
else
setTimeout("resetear()",500)
}
function resetear(mn, mx, rapidez, idBan)
{
if (banZoom == null)
{
banZoom = document.getElementById(idBan)
banZoom.maxTam = mx
banZoom.minTam = mn
banZoom.rapidez = rapidez
}
banZoom.style.fontSize = banZoom.minTam
setTimeout("creceLetra()",rapidez)
}
</script>
14. Agregar un botón “Imprimir”:
<SCRIPT Language="Javascript">
/*
This script is written by Eric (Webcrawl@usa.net)
Si quieres encontrar mas scripts
visita MundoJavascript.com
*/
function printit(){
if (window.print) {
window.print() ;
} else {
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
WebBrowser1.ExecWB(6, 2);//Use a 1 vs. a 2 for a prompting dialog box WebBrowser1.outerHTML = "";
}
}
</script>
<SCRIPT Language="Javascript">
var NS = (navigator.appName == "Netscape");
var VERSION = parseInt(navigator.appVersion);
if (VERSION > 3) {
document.write('<form><input type=button value="Imprimir" name="Print" onClick="printit()"></form>');
}
</script>
15. Un menú desplegable:
(Esto va entre <head> y </head>)
<script>
<!--
function land(ref, target)
{
lowtarget=target.toLowerCase();
if (lowtarget=="_self") {window.location=loc;}
else {if (lowtarget=="_top") {top.location=loc;}
else {if (lowtarget=="_blank") {window.open(loc);}
else {if (lowtarget=="_parent") {parent.location=loc;}
else {parent.frames[target].location=loc;};
}}}
}
function jump(menu)
{
ref=menu.choice.options[menu.choice.selectedIndex].value;
splitc=ref.lastIndexOf("*");
target="";
if (splitc!=-1)
{loc=ref.substring(0,splitc);
target=ref.substring(splitc+1,1000);}
else {loc=ref; target="_self";};
if (ref != "") {land(loc,target);}
}
//-->
</script>
(Esto va entre <body> y </body>)
<form action="dummy" method="post">
<select name="choice" size="1" onChange="jump(this.form)">
<option value="#">Seleccionar una opción</option>
<option value="http://www.mrdevy.com">Mrdevy.com</option>
<option value="http://www.tecnomagazine.com.ar">Tecnomagazine</option>
<option value="">- - - - - - - - - -</option>
<option value="http://www.tectimes.com">TecTimes</option>
</select></form>