Javascript

(Por Kalimero)

El Javascipt es un lenguaje interpretado, o sea, que el sistema lo lee y traduce al mismo tiempo que lo va ejecutando, no confundir con el Java.
Con Javascript se pueden lograr efectos realmente majos en una página, así como formularios, imágenes, textos, etc, aunque no tiene la potencia del Java, pero tiene la ventaja de que la mayoría de los navegadores no tienen problemas para interpretarlo.
Para los webmasters, aquí os dejo ejemplos de utilidades que podéis insertar en Javascript, sólo tenéis que copiarlos y pegarlos en vuestro documento html.

---

Menú flotante (Poner en el HEAD)

<div id="point1" STYLE="position:absolute;visibility:visible;"> <!--Configure the table below.--> <table width="100" border="1" bordercolor="#BBBBBB" cellspacing="0" cellpadding="4"> <tr> <td align=center> El Cactus de Kalimero </td> </tr> <tr> <td align=center> <font size="2"><a href="paginauno.html">Link Uno</a></font></td> </tr> <tr> <td align=center> <font size="2"><a href="paginados.html">Link Dos</a></font> </td> </tr> <tr> <td align=center> <font size="2"><a href="pagina3.html">Link Tres</a></font> </td> </tr> <tr> <td align=center> <font size="2"><a href="pagina4.html">Link Cuatro</a></font></td> </tr> <tr> <td align=center> <font size="2"><a href="pagina5.html">Link Cinco</a></font></td> </tr> </table> <!--No edites bajo esta linea konste ke te he avisao (kalimero) --> </div> <script LANGUAGE="JavaScript1.2"> var XX=20; // X position of the scrolling objects var xstep=1; var delay_time=30; //Begin of the unchangable area, please do not modify this area var YY=0; var ch=0; var oh=0; var yon=0; var ns4=document.layers?1:0 var ie=document.all?1:0 var ns6=document.getElementById&&!document.all?1:0 if(ie){ YY=document.body.clientHeight; point1.style.top=YY; } else if (ns4){ YY=window.innerHeight; document.point1.pageY=YY; document.point1.visibility="hidden"; } else if (ns6){ YY=window.innerHeight document.getElementById('point1').style.top=YY } function reloc1() { if(yon==0){YY=YY-xstep;} else{YY=YY+xstep;} if (ie){ ch=document.body.clientHeight; oh=point1.offsetHeight; } else if (ns4){ ch=window.innerHeight; oh=document.point1.clip.height; } else if (ns6){ ch=window.innerHeight oh=document.getElementById("point1").offsetHeight } if(YY<0){yon=1;YY=0;} if(YY>=(ch-oh)){yon=0;YY=(ch-oh);} if(ie){ point1.style.left=XX; point1.style.top=YY+document.body.scrollTop; } else if (ns4){ document.point1.pageX=XX; document.point1.pageY=YY+window.pageYOffset; } else if (ns6){ document.getElementById("point1").style.left=XX document.getElementById("point1").style.top=YY+window.pageYOffset } } function onad() { if(ns4) document.point1.visibility="visible"; loopfunc(); } function loopfunc() { reloc1(); setTimeout('loopfunc()',delay_time); } if (ie||ns4||ns6) window.onload=onad </script>

Menú scroll horizontal

<style> body{ overflow-x:hidden; overflow-y:scroll; } </style> <script language="JavaScript1.2"> /* Scrollable Menu Links- By Dynamicdrive.com For full source, TOS, and 100s DTHML scripts Visit http://dynamicdrive.com */ //configurar las direcciones de las imagenes de las flechas var goleftimage='pointer2.gif' var gorightimage='pointer.gif' //configurar el ancho del menu var menuwidth=300 //configurar la velocidad del scroll (1-10) var scrollspeed=6 //especificar el contenido del menu var menucontents='<nobr><a href="http://www.mundojavascript.com">MundoJavascript.com</a> | <a href="http://www.cambiabanners.com">Cambiabanners.com</a> | <a href="http://www.precios10.com">Precios10.com</a> | <a href="http://www.mundojavascript.com/recursos_gratis_webmasters">Recursos webmasters</a> | <a href="http://www.webservicio.com/tops/index.phtml?user=752&codigotop=452&click=1284">Ranking de webs</a></nobr>' ////NO NEED TO EDIT BELOW THIS LINE//////////// var actualwidth='' var ns_scroll function fillup(){ if (document.all){ test2.innerHTML=menucontents actualwidth=test2.offsetWidth } else if (document.layers){ ns_scroll=document.ns_scrollmenu.document.ns_scrollmenu2 ns_scroll.document.write(menucontents) ns_scroll.document.close() actualwidth=ns_scroll.document.width } } window.onload=fillup function moveleft(){ if (document.all&&test2.style.pixelLeft>(menuwidth-actualwidth)) test2.style.pixelLeft-=scrollspeed else if (document.layers&&ns_scroll.left>(menuwidth-actualwidth)) ns_scroll.left-=scrollspeed lefttime=setTimeout("moveleft()",50) } function moveright(){ if (document.all&&test2.style.pixelLeft<0) test2.style.pixelLeft+=scrollspeed else if (document.layers&&ns_scroll.left<0) ns_scroll.left+=scrollspeed righttime=setTimeout("moveright()",50) } if (document.all||document.layers){ with (document){ write('<table border="0" cellspacing="0" cellpadding="0">') write('<td valign="middle"><a href=#" onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)"><img src="'+goleftimage+'"border=0></a> </td>') write('<td valign="top">') if (document.all){ write('<span style="position:relative;width:'+menuwidth+';">') write('<span style="position:absolute;width:'+menuwidth+';clip:rect(0 '+menuwidth+' auto 0)">') write('<span id="test2" style="position:absolute;left:0;top:0">') write('</span></span></span>') } else if (document.layers){ write('<ilayer width='+menuwidth+' name="ns_scrollmenu">') write('<layer name="ns_scrollmenu2" left=0 top=0></layer></ilayer>') } write('</td>') write('<td valign="middle"> <a href="#" onMouseover="moveright()" onMouseout="clearTimeout(righttime)">') write('<img src="'+gorightimage+'"border=0></a>') write('</td></table>') } } </script>

Combobox para elegir link, con la opción de que sea en una nueva ventana

<form name="mycombowopt"> <select name="example" size=1> <option value="http://www.tinet.org/~pcarmona">El Cactus de kalimero</option> <option value="http://www.civila.com">Civila</option> <option value="http://personal.telefonica.terra.es/web/betsyman/">Betsyman Web</option> </select> <input type="button" value="Ir!" onClick="gothere()"> <br> <input type="checkbox" name="windowoption" value="ON">Abrir en nueva ventana</p> </form>  <script language="javascript"> <!--  /*Combo box with "open in new window" credit -By Website Abstraction (www.wsabstract.com) Over 200+ free scripts here! */  function gothere(){ var thebox=document.mycombowopt if (thebox.windowoption.checked){ if (!window.newwindow) newwindow=window.open("") newwindow.location= thebox.example.options[thebox.example.selectedIndex].value } else location= thebox.example.options[thebox.example.selectedIndex].value } //--> </script>

Abrir una ventana dimensionada a la vez que otra.

<SCRIPT LANGUAGE="JavaScript"> open('http://www.tinet.org/~pcarmona', 'Sizewindow', 'width=300,height=350,scrollbars=no,toolbar=no') </SCRIPT>

Quitar la a veces molesta línea de la parte inferior de los hipervínculos.

<Head> <style> <!--//A:link {text-decoration: none;}A:visited {text-decoration: none;}//--> </style> </Head>

Al pasar el cursor por encima de la imagen sale un mensaje

<a href="" onMouseOver="alert('TEXTO DEL MENSAJE');return true;"> <IMG SRC="NOMBRE DE LA IMAGEN" border="0"></a>

Al pasar el cursor encima de un texto nos lleva a una dirección

<a href="" onmouseover="parent.location='http://www.fut.es/~pcarmona'">El Cactus de Kalimero </A> <p>

Para páginas con frames, no permite ver sólo un frame sino los dos frames o más juntos. (Colocar el código en cada frame)

<script LANGUAGE="JavaScript"> <!-- if (top == self) self.location.href = "http://www.fut.es/~pcarmona"; // --> </script>

Para webs sin frames, mantiene tu página en primer plano, y no puede estar en frames de otro "espabilao"

<SCRIPT LANGUAGE="JavaScript"> <!--- Se esconde el codigo a navegadores sin JS if (window != window.top) top.location.href = location.href; // --> </SCRIPT>  ---------------------------------------------------  <SCRIPT LANGUAGE="Javascript"> <!--- if (parent.frames.length) top.location.href= document.location; // ---> </SCRIPT>

Que se abra una ventana al entrar en la web (se puede definir tamaño, barras, etc, etc, etc)

<SCRIPT language=Javascript> open('legal.htm','AVISOLEGAL',"toolbar=0,location=0,status=0, menubar=0,scrollbars=yes,resizable=yes,width=490,height=232");</SCRIPT>

Abrir una ventana al apretar un enlace (también se puede definir tamaño, etc)

<script language="JavaScript"> <!-- function winopen(pagina,nombreventana) { myWin=open(pagina,nombreventana, 'width=530,height=400,toolbar=no,location=no, directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,titlebar=no'); } //--> </script>

Para llamar a la página (caso anteriror)

javascript:winopen('http://www.tinet.org/~pcarmona','EL CACTUS DE KALIMERO')"

Que se cierre la ventana al cabo de un rato determinado

<script language="javascript">setTimeout("self.close();",7000)</script>

Al pulsar el boton derecho sale un menu (Se ha de poner el script en el HEAD)

<STYLE> <!-- .skin0{ position:absolute; width:175px; border:2px solid white; background-color:#C0C0C0; font-family:Verdana; font-size: 10px; line-height:15px; cursor:default; visibility:hidden; } .menuitems{ padding-left:10px; padding-right:10px; } --> </style> <script language="JavaScript1.2"> var menuskin=0 var display_url=0 function showmenuie5(){ var rightedge=document.body.clientWidth-event.clientX var bottomedge=document.body.clientHeight-event.clientY if (rightedge<ie5menu.offsetWidth) ie5menu.style.left=document.body.scrollLeft+event.clientX-ie5menu.offsetWidth else ie5menu.style.left=document.body.scrollLeft+event.clientX if (bottomedge<ie5menu.offsetHeight) ie5menu.style.top=document.body.scrollTop+event.clientY-ie5menu.offsetHeight else ie5menu.style.top=document.body.scrollTop+event.clientY ie5menu.style.visibility="visible" return false } function hidemenuie5(){ ie5menu.style.visibility="hidden" } function highlightie5(){ if (event.srcElement.className=="menuitems"){ event.srcElement.style.backgroundColor="highlight" event.srcElement.style.color="white" if (display_url==1) window.status=event.srcElement.url } } function lowlightie5(){ if (event.srcElement.className=="menuitems"){ event.srcElement.style.backgroundColor="" event.srcElement.style.color="black" window.status='' } } function jumptoie5(){ if (event.srcElement.className=="menuitems"){ if (event.srcElement.getAttribute("target")!=null) window.open(event.srcElement.url,event.srcElement.getAttribute("target")) else window.location=event.srcElement.url } } </script> <!--[if IE]> <div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5()"> <div class="menuitems" url="noticias.htm" target="_self">- Noticias</div> <div class="menuitems" url="encuesta.htm" target="_self">- Encuesta</div> <div class="menuitems" url="sms.htm" target="_self">- Mensajes SMS</div> <div class="menuitems" url="email.htm" target="_self">- Lista de Correo</div> <hr> <div class="menuitems" url="http://www.melodysoft.com/cgi-bin/foro.cgi?ID=AlexWebPage" target="_self">- Foro</div> <div class="menuitems" url="chat2.html" target="_self">- Webchat</div> <hr> <div class="menuitems" url="http://www.elhacker.net/cgi-bin/birdcast.cgi" target="_self">- Recomendar</div> <div class="menuitems" url="formulario2.htm" target="_self">- Contactar</div> <div class="menuitems" url="bug.htm" target="_self">- ¿Algún fallo?</div> </div> <![endif]--> <script language="JavaScript1.2"> if (document.all&&window.print){ if (menuskin==0) ie5menu.className="skin0" else ie5menu.className="skin1" document.oncontextmenu=showmenuie5 document.body.onclick=hidemenuie5 } </script>

Lista de opciones

<table height="74"> <tr> <td class="c1" vAlign="top" width="19%" height="70"> <form> <table align="center" cellPadding="0" class="t1" width="116" height="86"> <tbody> <tr> <td align="left" bgColor="#000000" height="15" width="129"> <p align="left"><font face="Verdana, Arial, Helvetica, sans-serif" size="1"><font color="#FFFFFF"> <img border="0" src="flecha.gif" width="6" height="7"> </font><b><font color="#fdcf66">I n d e x </font></b><font face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFFF" size="2"><img border="0" src="flecha.gif" width="6" height="7"></font> </font></p> </td> </tr> <tr> <td height="61" width="129"> <div align="center"> <p align="left" style="word-spacing: 0; line-height: 100%; text-indent: 0; margin: 0"> <font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"> <select name="llista" size="1" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8 pt"> <option selected value="error.htm"><Selecciona></option> <option value="antivirus.htm">Antivirus</option> <option value="Buscadores1.htm">Buscadores</option> <option value="buscamp3.htm">Busca MP3</option> <option value="covers1.htm">Covers</option> <option value="criptografia.htm">Criptografía</option> <option value="cracks.htm">Cracks</option> <option value="chat2.html">Chat</option> <option value="dibujosms.htm">Dibujos SMS</option> <option value="divx.htm">DivX</option> <option value="dni.htm">DNI</option> <option value="emuladores.htm">Emuladores</option> <option value="encuesta.htm">Encuesta</option> <option value="formulario2.htm">Formulario</option> <option value="http://www.melodysoft.com/cgi-bin/foro.cgi?ID=AlexWebPage">Foro</option> <option value="fotos.htm">Fotos</option> <option value="grabadoras.htm">Grabadoras</option> <option value="Inet1.htm">Guía Internet</option> <option value="http://www.terra.es/personal3/fistror/hacking.htm">Hacking</option> <option value="Info.html">Info Browser</option> <option value="scripts1.htm">IRC Scripts</option> <option value="irc2.htm">IRC Utils</option> <option value="javascript.htm">JavaScript</option> <option value="juegos.htm">Juegos</option> <option value="guest.htm">Libro de Visitas</option> <option value="links.htm">Links</option> <option value="Linux.htm">Linux</option> <option value="email.htm">Lista Correo</option> <option value="lomejor.htm">Lo Mejor</option> <option value="melodias.htm">Melodías</option> <option value="gsm.htm">Mensajes SMS</option> <option value="noticias.htm">Noticias</option> <option value="orgasmo.htm">Orgasmo</option> <option value="http://www.elhacker.net/cgi-bin/birdcast.cgi">Recomendar</option> <option value="solicitudweb.htm">Redireccionador</option> <option value="reloj.htm">Reloj</option> <option value="remailer.htm">Re-Mailer</option> <option value="seguridad.htm">Seguridad</option> <option value="tarifas.htm">Tarifas</option> <option value="moviles2.htm">Telefonía</option> <option value="Textos1.htm">Textos</option> <option value="trivial.htm">Trivial</option> <option value="trucosvisual.htm">Trucos VBasic</option> <option value="trucoswin.htm">Trucos Win</option> <option value="harddisk.htm">Tu HD</option> <option value="votame.htm">Votame!</option> <option value="webcam.htm">WebCams</option> <option value="webmasters.htm">Webmasters</option> <option value="windows.htm">Windows</option> <option value="bsod.htm">Win vs Linux</option> <option value="juego.html">3 en Raya</option> </select> </font> </div> <font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#FFFFFF"> <div align="center"> <p align="left" style="word-spacing: 0; line-height: 100%; text-indent: 0; margin: 0"> </div> </font> <div align="center"> <p align="left" style="word-spacing: 0; line-height: 100%; text-indent: 0; margin: 0"> <font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"> <input name="Submit" onclick="top.location.href=this.form.llista.options[this.form.llista.selectedIndex].value" type="button" value=" - Vamos! - " style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8 pt"> </font> </div> </td> </tr> </tbody> </table> </form> </td> </tr> </table>

---

Utilidades

Insertar fecha

<!-- Colocar dentro del tag BODY --> <script languaje="JavaScript"> var mydate=new Date() var year=mydate.getYear() if (year < 1000) year+=1900 var day=mydate.getDay() var month=mydate.getMonth() var daym=mydate.getDate() if (daym<10) daym="0"+daym var dayarray=new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado") var montharray=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre") document.write("<small><font color='000000' face='Arial'>"+dayarray[day]+" "+daym+" de "+montharray[month]+" de "+year+"</font></small>") </script>

Copiar al portapapeles

<script language="Javascript"> <!-- //specify whether contents should be auto copied to clipboard (memory) //Applies only to IE 4+ //0=no, 1=yes var copytoclip=1 function HighlightAll(theField) { var tempval=eval("document."+theField) tempval.focus() tempval.select() if (document.all&©toclip==1){ therange=tempval.createTextRange() therange.execCommand("Copy") window.status="Contents highlighted and copied to clipboard!" setTimeout("window.status=''",1800) } } //--> </script> <a href="javascript:HighlightAll('form.fuente')">Copiar al Portapapeles</a>

 

Cuenta progresiva

Internet desde su creación!") } //cambiar la fecha countup(2001,01,03) </script>

Te dice desde que dirección web vienes

<script language=JavaScript> <!--- start of javascript hide from older browsers //.. var caller = document.referrer document.write("<font size='+2'>"); document.write("<a href='" + caller + "'>"+"("+document.referrer +")" +"</a>"); document.write(".</font><br>"); //end of script unhide ---> </script>

Anular botón derecho e izquierdo del ratón

<!-- Botón izquierdo y derecho del mouse -->  <script LANGUAGE="JavaScript1.1">  <!-- Adaptado por Kalimero: Compatible con IE y NS -->  function ambos(e) { if (navigator.appName == 'Netscape' && (e.which == 1 || e.which == 3 || e.which == 2)){ alert('Los botones del mouse han sido inhabilitados') return false; } else if (navigator.appName == 'Microsoft Internet Explorer' && (event.button == 1 || event.button == 2)){ alert('Los botones del mouse han sido inhabilitados') } } document.onmousedown=ambos </script>

Anular botón de la izquierda

<!-- Botón izquierdo del mouse --> <script LANGUAGE="JavaScript1.1"> <!-- Adaptado por Tk: Compatible con IE y NS --> function izquierda(e) { if (navigator.appName == 'Netscape' && (e.which == 1 || e.which == 2)){ alert('Botón izquierdo inhabilitado') return false; } else if (navigator.appName == 'Microsoft Internet Explorer' && (event.button == 1)){ alert('Botón izquierdo inhabilitado') } } document.onmousedown=izquierda </script>

Anular botón de la derecha

<!-- Botón derecho del mouse --> <script LANGUAGE="JavaScript1.1">  <!-- Adaptado por kalimero: Compatible con IE y NS -->  function derecha(e) { if (navigator.appName == 'Netscape' && (e.which == 3 || e.which == 2)){ alert('Botón derecho no chuta aqui') return false; }  else if (navigator.appName == 'Microsoft Internet Explorer' && (event.button == 2)){ alert('Botón derecho no chuta aqui') } } document.onmousedown=derecha </script>

Para no permitir el botón derecho (aparece un "alert")

<script language="JavaScript1.1"> <!-- Begin function right(e) { var msg = " [ www.fut.es/~pcarmona ] ";if (navigator.appName == 'Netscape' && e.which == 3) { alert(msg); // Delete this line to disable but not alert user return false; } else if (navigator.appName == 'Microsoft Internet Explorer' && event.button==2) { alert(msg); // Delete this line to disable but not alert user return false; } return true; } document.onmousedown = right; // End --> </script>

 

Muestra versión del navegador

< <Script Language="JavaScript"> <!--document.write(navigator.appName) document.write(navigator.appVersion)//--> </script

Para hacer la Página de Inicio

 <a href="#" onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.tinet.org/~pcarmona');return false">Página de inicio</a>

Añadir a Favoritos

<SCRIPT LANGUAGE="JavaScript"> <!-- function addBookmark() { if (window.external) external.AddFavorite("http://www.tinet.org/~pcarmona", "[Kalimero]") else alert("Tu navegador no soporta esta caracteristica"); } // --> </SCRIPT>

Imprimir la página

<a href="javascript:window.print()">Imprimir</a>

Recomendar una página

<form name="eMailer"> ENVÍA ESTA PÁGINA A UN AMIGO <br> Indica su e-mail: <br> <input type="text" name="address" size="25"> <br> <input type="button" value="Send this URL" onClick="mailThisUrl();"> </form> <script language="JavaScript1.2"> // (C) 2000 www.CodeLifter.com // Este y otros muchos javascripts // los encontraras en MundoJavascript.com var good; function checkEmailAddress(field) { // the following expression must be all on one line... var goodEmail = field.value.match(/\b(^(\S+@).+((\.com)|(\.net)|(\.edu)|(\.mil)|(\.gov)|(\.org)|(\..{2,2}))$)\b/gi); if (goodEmail){ good = true } else { alert('Por favor introduce un e-mail valido') field.focus() field.select() good = false } } u = window.location; m = "Pienso que te puede interesar esta página..."; function mailThisUrl(){ good = false checkEmailAddress(document.eMailer.address) if (good){ // the following expression must be all on one line... window.location = "mailto:"+document.eMailer.address.value+"?subject="+m+"&body="+document.title+" "+u; } } </script>

Protege tu E-MAIL de buscadores de SPAM

<SCRIPT LANGUAGE="JavaScript"> <!-- Begin user = "usuario"; site = "tusitio.com"; document.write('<a href=\"mailto:' + user + '@' + site + '\">'); document.write(user + '@' + site + '</a>'); // End --> </SCRIPT>

Ver código fuente (Copiar dentro del BODY)

<!-- Copiar dentro del tag BODY --> <script type="text/javascript"> function verFuente(pagina){ window.location = "view-source:" + pagina ; } </script>

---

Curiosidades

Te enseña la hora y el texto que quieras en la barra del status

 <script language="JavaScript"> <!-- mensaje=" |======| .: el Cactus de Kalimero :. " function hora() { var h = new Date(); window.status="|======| " + h.getHours() +":"+ h.getMinutes() +"" +mensaje ; window.setTimeout('hora()',100); } hora() //--> </script>

Escribir en la barra de estado (status) al pasar el mouse por encima (onmouseover)

<a href="mailto:pcarmona@tinet.org?subject=Comentarios/Sugerencias" onMouseOver="window.status='[ contacta con el webmaster ]';return true"> Kalimero</a>

 

Distinto mensaje a cada hora

<script language="JavaScript"><!-- if (hora.getHours() == "0"){ document.write("Ya va siendo hora deIrse a dormir")} if (hora.getHours() == "1"){ document.write("Mañana tendrás sueño")}   if (hora.getHours() == "2"){ document.write("¿Todavia sigues ahí?")}   if (hora.getHours() == "3"){ document.write("¡¡¡AKUESTATE!!!")} if (hora.getHours() == "4"){ document.write("¡¡¡¡¡Que sueño!!!!!!.")}   if (hora.getHours() == "5"){ document.write("¿¿Te levantas?? o ¿¿te acuestas??")} if (hora.getHours() == "6"){ document.write("kepasa, ¿no tienes nada mejor que hacer a las 6 de la mañana?")}   if (hora.getHours() == "7"){ document.write("¿ke coño haces conectado tan pronto?")} if (hora.getHours() == "8"){ document.write("¿nokrees ke es un poko pronto para estar konectado?")}   if (hora.getHours() == "9"){ document.write("¡buenos dias! ¿Ke has desayunado?")} if (hora.getHours() == "10"){ document.write("¿Como esque no estas en el cole?")} if (hora.getHours() == "11"){ document.write("Buenos dias .")}   if (hora.getHours() == "12"){ document.write("aprovechas kualquier momento para konectarte, ¿eh?")}   if (hora.getHours() == "13"){ document.write("aprovechando la horade komer para konectarte, ¿eh?")} if (hora.getHours() == "14"){ document.write("¿Hascomido ya?")} if (hora.getHours() == "15"){ document.write("¿Que has comido?")} if (hora.getHours() == "16"){ document.write("Haceun bonito dia")} if (hora.getHours() == "17"){document.write("¿¿Hoy no sales??")}   if (hora.getHours() == "18"){ document.write("¡¡¡HOLAAA!!!")}   if (hora.getHours() == "19"){ document.write("¿no tendriasque estar haciendo los deberes para mañana?")}   if (hora.getHours() == "20"){ document.write("¿¿Que haces??")}   if (hora.getHours() == "21"){ document.write("Ya habras hecho losdeberes ¿no?")} if (hora.getHours() == "22"){ document.write("¿¿Has cenado ya??")}   if (hora.getHours() == "23"){ document.write("A dormir que mañana tienes que madrugar") } // --></script>

Para que el cursor sea un punto de mira pequeño

<style type="text/css"> <!-- body { cursor: crosshair} --> </style>

Un texto sigue al puntero del ratón

<html> <head> <style> .spanstyle { position:absolute; visibility:visible; top:-50px; font-size:9pt; font-family:Tahoma; font-weight:bold; color:blue; } </style> <script> var x,y var step=20 var flag=0 // Tienes que dejar un espacio al final de tu mensaje!!!!! var message="Tu mensaje va aqui... " message=message.split("") var xpos=new Array() for (i=0;i<=message.length-1;i++) { xpos[i]=-50 } var ypos=new Array() for (i=0;i<=message.length-1;i++) { ypos[i]=-50 } function handlerMM(e){ x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY flag=1 } function makesnake() { if (flag==1 && document.all) { for (i=message.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+step ypos[i]=ypos[i-1] } xpos[0]=x+step ypos[0]=y for (i=0; i<message.length-1; i++) { var thisspan = eval("span"+(i)+".style") thisspan.posLeft=xpos[i] thisspan.posTop=ypos[i] } } else if (flag==1 && document.layers) { for (i=message.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+step ypos[i]=ypos[i-1] } xpos[0]=x+step ypos[0]=y for (i=0; i<message.length-1; i++) { var thisspan = eval("document.span"+i) thisspan.left=xpos[i] thisspan.top=ypos[i] } } var timer=setTimeout("makesnake()",30) } </script> </head> <body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll"> </body> <script> <!-- Beginning of JavaScript - for (i=0;i<=message.length-1;i++) { document.write("<span id='span"+i+"' class='spanstyle'>") document.write(message[i]) document.write("</span>") } if (document.layers){ document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = handlerMM; // - End of JavaScript - --> </script> </html>

Terremoto en la pantalla

<!-- para llamarlo con un botón--> <INPUT onclick=shake(40) type=button value=""Terremoto""> <SCRIPT language=JavaScript1.2> <!-- Begin function shake(n) { if (n==1) {document.body.bgColor = "#0000DA"; } else {document.body.bgColor = "#FF8C00" } if (self.moveBy) { for (i = 15; i > 0; i--) { for (j = n; j > 0; j--) { self.moveBy(0,i); self.moveBy(i,0); self.moveBy(0,-i); self.moveBy(-i,0); } } } } // End --> </SCRIPT>

Te hace un fundido de fondo (fade de blanco a negro)

<SCRIPT LANGUAGE="JavaScript"> <!-- function toHex(dec) { var hexCharacters = "0123456789ABCDEF" if (dec < 0) return "00" if (dec > 255) return "FF" var i = Math.floor(dec / 16) var j = dec % 16 return hexCharacters.charAt(i) + hexCharacters.charAt(j) } function setbgColor(red, green, blue) { document.bgColor = "#" + toHex(red) + toHex(green) + toHex(blue) } function fade(sred, sgreen, sblue, ered, egreen, eblue, step) { for(var i = 0; i <= step; ++i) { // set current red descriptor var red = Math.floor(sred * ((step - i) / step) + ered * (i / step)) // set current green descriptor var green = Math.floor(sgreen * ((step - i) / step) + egreen * (i / step)) // set current blue descriptor var blue = Math.floor(sblue * ((step - i) / step) + eblue * (i / step)) // set background color according to descriptors setbgColor(red, green, blue) } } // --> </SCRIPT> </HEAD> <BODY onLoad="fade(255, 255, 255, 0, 0, 0, 32)" onUnload="fade(0, 0, 0, 255, 255, 255, 32)">

Una imagen moviéndose por la pantalla

<!-- Inicio Noticias que se mueve --> <div id="mierda" style="position: absolute; left: 100; top: 242; width: 116; height: 58; z-index: 1"> <script> if (test) { document.write('<a href="noticias.htm" target="_blank"><img src="kalimero.gif" border="0"></a>'); } </script> </div> <!-- Final Noticias que se mueve -->

Una imagen de fondo centrada

</script> if (document.all||document.getElementById) document.body.style.background="url('COLOCA AQUI LA IMAGEN DEL FONDO') white center no-repeat fixed" </script>

Cambiar las barras de scroll

Poner en el <body>

<style> <!-- BODY { scrollbar-base-color : #000000; scrollbar-arrow-color : #FFFFFF; } </style>

Contraseña sencilla

<SCRIPT LANGUAGE="JavaScript"> function Saltar(pal) { window.location=pal+".html" } </SCRIPT> <form> <font face=Verdana><font size=-1>Password:</font><br> <input TYPE="password" name=palclave size=30 VALUE=""><br><INPUT TYPE="button" VALUE="Acceder" onClick="Saltar(this.form.palclave.value)"> </form>

Scrolll en la barra de título  (Poner en el HEAD)

<SCRIPT LANGUAGE="JavaScript"> <!-- Begin var scrl = " Poner aqui el mensaje deseado "; function scrlsts() { scrl = scrl.substring(1, scrl.length) + scrl.substring(0, 1); document.title = scrl; setTimeout("scrlsts()", 300); } // End --> </script> ----------------poner en el body <BODY onLoad="scrlsts()">

Tabla con borde Flash

<script language="JavaScript1.2"> <!-- /* © 2000 The Abusive_Poet Rights Registered and Reserved Please respect my work */ function flashit(){ if (!document.all) return if (myexample.style.borderColor=="green") myexample.style.borderColor="red" else myexample.style.borderColor="green" } setInterval("flashit()", 500) //--> </script> Texto que parpadea ------------ esto entre el body <body onload="setInterval('flash2.filters.alpha.opacity=(flash2.filters.alpha.opacity+5)%100',20)"> -----esto en la parte del body que quieras que aparezca <h1 id="flash2" style="width:50%;filter:alpha(opacity=100);">AQUI TU TEXTO</h1>

Texto que se expande

<SCRIPT LANGUAGE="JavaScript"> <!-- Original: Charles Foster (wcms_sf@msn.com) --> <!-- Begin var speed = 100; var cycledelay = 2000; var maxsize = 20; var x = 0; var y = 0; var themessage, size; var esize = "</font>"; function initArray() { this.length = initArray.arguments.length; for (var i = 0; i < this.length; i++) { this[i] = initArray.arguments[i]; } } var themessage2 = new initArray( "Bienvenido a MundoJavascript.com", "Este script te permitirá. . . .", "...atraer la atención de tus visitantes. . . .?", "...al entrar en tu web." ); if(navigator.appName == "Netscape") document.write('<layer id="wds"></layer><br>'); if (navigator.appVersion.indexOf("MSIE") != -1) document.write('<span id="wds"></span><br>'); function upwords(){ themessage = themessage2[y]; if (x < maxsize) { x++; setTimeout("upwords()",speed); } else setTimeout("downwords()",cycledelay); if(navigator.appName == "Netscape") { size = "<font point-size='"+x+"pt'>"; document.wds.document.write(size+"<center>"+themessage+"</center>"+esize); document.wds.document.close(); } if (navigator.appVersion.indexOf("MSIE") != -1){ wds.innerHTML = "<center>"+themessage+"</center>"; wds.style.fontSize=x+'px' } } function downwords(){ if (x > 1) { x--; setTimeout("downwords()",speed); } else { setTimeout("upwords()",cycledelay); y++; if (y > themessage2.length - 1) y = 0; } if(navigator.appName == "Netscape") { size = "<font point-size='"+x+"pt'>"; document.wds.document.write(size+"<center>"+themessage+"</center>"+esize); document.wds.document.close(); } if (navigator.appVersion.indexOf("MSIE") != -1){ wds.innerHTML = "<center>"+themessage+"</center>"; wds.style.fontSize=x+'px' } } setTimeout("upwords()",speed); // End --> </script>

Texto neón

<h2> <script language="JavaScript1.2"> var message="Escribe tu texto NEON" var neonbasecolor="gray" var neontextcolor="yellow" var flashspeed=100 //in milliseconds ///No need to edit below this line///// var n=0 if (document.all){ document.write('<font color="'+neonbasecolor+'">') for (m=0;m<message.length;m++) document.write('<span id="neonlight">'+message.charAt(m)+'</span>') document.write('</font>') //cache reference to neonlight array var tempref=document.all.neonlight } else document.write(message) function neon(){ //Change all letters to base color if (n==0){ for (m=0;m<message.length;m++) tempref[m].style.color=neonbasecolor } //cycle through and change individual letters to neon color tempref[n].style.color=neontextcolor if (n<tempref.length-1) n++ else{ n=0 clearInterval(flashing) setTimeout("beginneon()",1500) return } } function beginneon(){ if (document.all) flashing=setInterval("neon()",flashspeed) } beginneon() </script> </h2>

Texto orbital dando vueltas alrededor del cursor

<SCRIPT LANGUAGE="JavaScript"> <!-- Original: El Cactus de Kalimero --> <!-- Web Site: http://go.to/kalimero --> <!-- Este script y otros muchos los puedes encontrar en --> <!-- El Cactus de Kalimero --> <!-- Begin if (document.all) { //Things you can alter yourLogo = "Aquí tu texto-"; //no menos de 2 letras! logoFont = "Arial"; logoColor = "000000"; //Nothing needs altering below! 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> >

---

Informaciones

Muestra la hora

<script language="JavaScript"> hora = new Date(); var minutos = hora.getMinutes (); if (minutos<=9) minutos = "0" + minutos; document.write(hora.getHours()+":"+minutos);</script>

Muestra la resolución de tu pantalla

<script language="JavaScript"><!-- if (screen.width + "x" +screen.height == "800x600") { document.write("Tienes una resolución de <b>800x600</b>. Verás la pagina perfectamente.")} if (screen.width + "x" +screen.height == "640x480"){ document.write("¿¿Comorr?? Tienes una resolución de<b>640x480</b>. Si no lo subes a 800*600,no podrás ver esta web...ni ninguna otra <b>800x600</b> pixels.")} if (screen.width + "x" +screen.height == "1024x768"){ document.write("Tienesuna resolución de <b>1024x768</b>. Verás la página perfectamente,pero un poco pequeña. Mejor <b>800x600</b> pixels.")} // --></script>

Determina el navegador que se esta usando

<!-- Colocar dentro del tag BODY -->  <script LANGUAGE="JavaScript">  <!--var nombre = navigator.appName if (nombre == "Microsoft Internet Explorer") url=("explorer.htm"); else url=("netscape.htm") window.location=url; //-->  </script>

Mandar un cookie

<SCRIPT language=JavaScript> <!-- Begin Script // les damos 30 dmas de vida a las cookies var validez = 30; var caduca = new Date(); caduca.setTime(caduca.getTime() + (validez*24*60*60*1000)); function getCookie(name){ var cname = name + "="; var dc = document.cookie; if (dc.length > 0) { begin = dc.indexOf(cname); if (begin != -1) { begin += cname.length; end = dc.indexOf(";", begin); if (end == -1) end = dc.length; return unescape(dc.substring(begin, end)); } } return null; } function setCookie(name, value, expires, path, domain, secure) { document.cookie = name + "=" + escape(value) + ((expires == null) ? "" : "; expires=" + expires.toGMTString()) + ((path == null) ? "" : "; path=" + path) + ((domain == null) ? "" : "; domain=" + domain) + ((secure == null) ? "" : "; secure"); } function Contador(info){ // Cuantas veces var cuenta = getCookie('Veces') if ( cuenta== null) { cuenta = 0; } else{ cuenta++; } setCookie ('Veces', cuenta, caduca); return cuenta+1; } function Cuando(info){ // Cuando me visitas var ahora = new Date() var tiempo = 0; tiempo = getCookie('Cuando'); tiempo = tiempo * 1; var ultimaVezFormateado = new Date(tiempo); // pasa de nzmero a fecha var intLastVisit = (ultimaVezFormateado.getYear() * 10000)+(ultimaVezFormateado.getMonth() * 100) + ultimaVezFormateado.getDate() var ultimaVezEnFecha = "" + ultimaVezFormateado; // se usan funciones substring var diaSemana = ultimaVezEnFecha.substring(0,3) var fechaMes = ultimaVezEnFecha.substring(4,11) var horaDia = ultimaVezEnFecha.substring(11,16) var anio = ultimaVezEnFecha.substring(23,25) var texto = diaSemana + ", " + fechaMes + " a las " +horaDia // lo muestra setCookie ("Cuando", ahora.getTime(), caduca) return texto; } // End Script -->

Leer un cookie

<SCRIPT language=JavaScript> <!-- var visitas = Contador(); if ( visitas == 1 ) { document.write("Esta es la primera vez que visitas mi web "); Cuando(); } else document.write("Has visitado esta Web <b>" + visitas + "</b> veces. La última fue en <b>" + Cuando() +"</b>. ") //--> </SCRIPT>

Decir cuantas veces ha visitado la página

Poner ésta parte en el HEAD

<SCRIPT LANGUAGE="JavaScript"> <!-- Begin function GetCookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function SetCookie (name, value) { var argv = SetCookie.arguments; var argc = SetCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); } function DeleteCookie (name) { var exp = new Date(); exp.setTime (exp.getTime() - 1); var cval = GetCookie (name); document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); } var expDays = 30; var exp = new Date(); exp.setTime(exp.getTime() + (expDays*24*60*60*1000)); function amt(){ var count = GetCookie('count') if(count == null) { SetCookie('count','1') return 1 } else { var newcount = parseInt(count) + 1; DeleteCookie('count') SetCookie('count',newcount,exp) return count } } function getCookieVal(offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } // End --> </SCRIPT>

Y ésto en el BODY en la parte que quieras que aparezca

SCRIPT LANGUAGE="JavaScript"> <!-- Begin document.write("Tu has estado aqui <b>" + amt() + "</b> veces.") // End --> </SCRIPT>

---

Esta mini-guía se la ha currao:
 KALIMERO
http://www.tinet.org/~pcarmona