Javascript para tu Web

• No permite utilizar el botón derecho y no aparece nada (ni alert, etc)

<script language="Javascript"> <!-- Begin document.oncontextmenu = function(){return false} // End --> </script>

• No permite seleccionar el contenido de una página

<script language="Javascript"> <!-- Begin function disableselect(e){ return false } function reEnable(){ return true } document.onselectstart=new Function ("return false") if (window.sidebar){ document.onmousedown=disableselect document.onclick=reEnable } // End --> </script>

• Código JavaScript para que aparezca un alert al utilizar el botón derecho

<script language="JavaScript"> <!-- Begin function right(e) { var msg = " [ www.hacetelaweb.com.ar ] "; 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>

• No permite el botón derecho y además te penaliza con 10 clicks

<script language="Javascript"> zaehler=0; function right(e) { if (navigator.appName == 'Netscape'){ if (e.which == 3 || e.which == 2){ alert("Aqui no puedes utilizar el botón derecho del mouse"); for(i=0;i!=zaehler;i++)alert("Ya te avisé, te penalizaré con \n "+(zaehler-i)+"\n clicks."); zaehler+=10; alert("¡La proxima vez que lo hagas será peor! www.hacetelaweb.com.art"); return false;}} if (navigator.appName == 'Microsoft Internet Explorer'){ if (event.button == 2 || event.button == 3){ alert("Aqui no puedes utilizar el botón derecho del mouse"); for(i=0;i!=zaehler;i++)alert("Ya te avisé, te penalizaré con \n "+(zaehler-i)+"\n clicks."); zaehler+=10; alert("¡La proxima vez que lo hagas será peor! www.hacetelaweb.com.ar"); return false;}} return true; } document.onmousedown=right; if (document.layers) window.captureEvents(Event.MOUSEDOWN); window.onmousedown=right; // --></script>

• Se abre una ventana al utilizar el botón derecho

<SCRIPT language=JavaScript> function right(e) { if (navigator.appName == 'Netscape' && (e.which == 3 || e.which == 2)) { a=window.open("http://www.hacetelaweb.com.ar/","WindowName","width=640,height=600,top=40,left=50,resizable=yes,scrollbars=yes,menubar=no,toolbar=no,status=no,location=no"); return false; } else if (navigator.appName == 'Microsoft Internet Explorer' && (event.button == 2 || event.button == 3)) { a=window.open("http://www.hacetelaweb.com.ar/","WindowName","width=640,height=600,top=40,left=50,resizable=yes,scrollbars=yes,menubar=no,toolbar=no,status=no,location=no"); return false; } return true; } document.onmousedown=right; window.onmousedown=right; </SCRIPT>

• Para hacer la Página de Inicio

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

• Añadir a Favoritos

<SCRIPT LANGUAGE="JavaScript"> <!-- function addBookmark() { if (window.external) external.AddFavorite("http://www.hacetelaweb.com.ar", "www.hacetelaweb.com.ar") else alert("Tu navegador no soporta esta caracteristica"); } // --> </SCRIPT>

• Para que al añadir a "Favoritos" suba el icono de tu sitio 

• (se tiene que colocar en el head) y además tenés que subir 

• un .ico a tu Hosting. (modificar el código para que busque el ícono)

<LINK REL="SHORTCUT ICON" HREF="http://www.tuservidor.com/iconos/nombreicono.ico">

• Cambiar las barras de scroll (colocar siempre en el style) (puedes

•  hacer infinitas variaciones cambiando color, tamaño, etc)

<style> <!-- BODY { scrollbar-base-color : #000000; scrollbar-arrow-color : #FFFFFF; } .nav { color : #FFCC00; font-size : 8pt;} --> </style>

• Otro ejemplo:

<STYLE type=text/css>BODY { SCROLLBAR-FACE-COLOR: #333333; SCROLLBAR-HIGHLIGHT-COLOR: #444444; SCROLLBAR-SHADOW-COLOR: #111111; SCROLLBAR-3DLIGHT-COLOR: #333333; SCROLLBAR-ARROW-COLOR: #ffffce; SCROLLBAR-TRACK-COLOR: #000000; SCROLLBAR-DARKSHADOW-COLOR: black } </STYLE>

• Que se vaya moviendo las palabras del status

<SCRIPT languague="JavaScript"> <!-- var cuenta=0 var texto=" poner el texto que deseas " function scrolltexto () { window.status=texto.substring (cuenta,texto.length)+ texto.substring(0,cuenta) if (cuenta <texto.length){ cuenta ++ }else{ cuenta=0 } setTimeout("scrolltexto()",150) } scrolltexto () //--> </SCRIPT>

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

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

• Varias frases o texto desplazándose por el status

<head> <SCRIPT> <!-- var ShowString = " " //La primera linea tiene que estar en blanco + "Aquí la frase 1 " //Puedes añadir mas frases, aparte de estas 3 + "Aquí la frase 2 " + "Aquí la frase 3 " + "Ejemplo de otra frase " var ShowWidth = 100 var ShowHead = 0 var ShowTail = ShowWidth var ShowLength = ShowString.length function Marquee () { var DisplayString if (ShowHead < ShowTail) DisplayString = ShowString.substring(ShowHead, ShowTail) else DisplayString = ShowString.substring(ShowHead, ShowLength) + ShowString.substring( 0, ShowTail) ShowHead = (ShowHead + 1 ) % ShowLength ShowTail = (ShowTail + 1 ) % ShowLength window.status = DisplayString TimerID = setTimeout("Marquee()", 100) //Cambia el numero para cambiar la velocidad } //--> </SCRIPT> </head>

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

• (onmouseover)

<a href="mailto:info@tusitio.com.ar?subject=Comentarios/Sugerencias" onMouseOver="window.status='[ contacta con el webmaster ]';return true"> el-brujo</a>

• Escribir en "Title" y hacer que se maya moviendo cada X segundos.

<SCRIPT LANGUAGE="JavaScript"> var txt=" www.hacetelaweb.com.ar - www.hacetelaweb.com.ar"; var espera=200; var refresco=null; function rotulo_title() { document.title=txt; txt=txt.substring(1,txt.length)+txt.charAt(0); refresco=setTimeout("rotulo_title()",espera);} rotulo_title(); </SCRIPT>

• Imprimir la página

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

• 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&&copytoclip==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>

Mejoras Diseño

• Punto de mira que ocupa toda la pantalla (color verde)

<div id="leftright" style="width:expression(document.body.clientWidth-2)"></div><div id="topdown" style="height:expression(document.body.clientHeight-2)"></div> <script language="JavaScript1.2"> <!-- if (document.all&&!window.print){ leftright.style.width=document.body.clientWidth-2 topdown.style.height=document.body.clientHeight-2 } else if (document.layers){ document.leftright.clip.width=window.innerWidth document.leftright.clip.height=1 document.topdown.clip.width=1 document.topdown.clip.height=window.innerHeight } function followmouse1(){ //move cross engine for IE 4+ leftright.style.pixelTop=document.body.scrollTop+event.clientY+1 topdown.style.pixelTop=document.body.scrollTop if (event.clientX<document.body.clientWidth-2) topdown.style.pixelLeft=document.body.scrollLeft+event.clientX+1 else topdown.style.pixelLeft=document.body.clientWidth-2 } function followmouse2(e){ //move cross engine for NS 4+ document.leftright.top=e.y+1 document.topdown.top=pageYOffset document.topdown.left=e.x+1 } if (document.all) document.onmousemove=followmouse1 else if (document.layers){ window.captureEvents(Event.MOUSEMOVE) window.onmousemove=followmouse2 } function regenerate(){ window.location.reload() } function regenerate2(){ setTimeout("window.onresize=regenerate",400) } if ((document.all&&!window.print)||document.layers) //if the user is using IE 4 or NS 4, both NOT IE 5+ window.onload=regenerate2 //--> </script>

• Para que el cursor sea un punto de mira (en pequeñito)

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

• Te dice el dia, mes y año del PC

<script language="JavaScript"><!-- var hoy = new Date(); dia = hoy.getDate(); mes = hoy.getMonth(); ano = hoy.getYear() + 0000; if (mes == "0") nombremes = "<font color=#00FF00 size=2>Enero</font>"; else if (mes == "1") nombremes = "<font color=#00FF00 size=2>Febrero</font>"; else if (mes == "2") nombremes = "<font color=#00FF00 SIZE=2>Marzo</font>"; else if (mes == "3") nombremes = "<font color=#00FF00 SIZE=2>Abril</font>"; else if (mes == "4") nombremes = "<font color=#00FF00 SIZE=2>Mayo</font>"; else if (mes == "5") nombremes = "<font color=#00FF00 SIZE=2>Junio</font>"; else if (mes == "6") nombremes = "<font color=#00FF00 SIZE=2>Julio</font>"; else if (mes == "7") nombremes = "<font color=#00FF00 SIZE=2>Agosto</font>"; else if (mes == "8") nombremes = "<font color=#00FF00 SIZE=2>Septiembre</font>"; else if (mes == "9") nombremes = "<font color=#00FF00 SIZE=2>Octubre</font>"; else if (mes == "10") nombremes = "<font color=#00FF00 SIZE=2>Noviembre</font>"; else nombremes = "<font color=#00FF00 SIZE=2>Diciembre</font>"; document.write (dia); document.write (" de "); document.write (nombremes); document.write (" del "); document.write (ano); // --></script>

• Cerrar la ventana al cabo de X rato

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

• Botón Cerrar Ventana (también windows.self.close())

<input type="button" onclick="javascript:window.close()" value="Cerrar Ventana" style="font-family: Verdana; font-size: 8 pt; color: #000080; background-color: #C0C0C0; border-style: solid">

• Botón Atrás, Actualizar y Adelante

<input type="button" value="Atrás" onclick="history.back()" style="font-family: Verdana; font-size: 8 pt"> <input type="button" value="Actualizar" onclick="window.location.reload()" style="font-family: Verdana; font-size: 8 pt"> <input type="button" value="Adelante" onclick="history.forward()" style="font-family: Verdana; font-size: 8 pt">

• Cambiar el puntero por uno personalizado:

<!-- en el style --> BODY { cursor:url(puntero.cur); } <!-- Elegir un puntero a nuestro gusto y guardar como cursor.cur -->

• Cambiar el puntero:

<!-- en un enlace --> <a href="#" style="cursor:help">enlace</a> <!-- saldrá el puntero de ayuda con un interrogante :) -->

Meta Tags

• Actualizar contenido cada X segundos o va hacia otra pagina en x 

• segunddos (en el head)

<!-- se refresca, se actualiza en tantos segundos --> <meta http-equiv="refresh" content="0"> <!-- va a hacia otra pagina en tantos segundos --> <meta http-equiv="refresh" content="8;URL=http://www.hacetelaweb.com.ar">

• El navegador o el proxy no guarde la página web en caché

<META HTTP-EQUIV="pragma" content="no-cache"> <!--si guarde cache --> <META HTTP-EQUIV="pragma" content="cache">

• El navegador o el proxy no guarde la página web en caché en lenguaje PHP

<? header("Cache-Control: no-cache, must-revalidate"); ?>

• Otras Meta-Tags básicas

<META content="text/html; charset=windows-1252" http-equiv=Content-Type> <meta http-equiv="Content-Language" content="es"> <META NAME="title" CONTENT="www.hacetelaweb.com.ar"> <META Name="description" CONTENT="descripcion"> <META Name="keywords" CONTENT="palabras clave"> <meta http-equiv="Reply-to" content="info@sudominio.com"> <META HTTP-EQUIV="pragma" content="no-cache"> <META Name="revisit" CONTENT="15 days"> <META Name="robots" CONTENT="all">

Rotación Banners

• Banner aleatorio

<script language="JavaScript"> <!-- Hide this script from old browsers -- function create() { this.width = '' this.height = '' this.src = '' this.href = '' this.border = '' this.mouseover = '' } function random(n) { var js_mult1=3141 var js_mult2=5821 var js_m1=100000000 var js_m2=10000 var js_iseed=0 var js_iseed1=0 var js_iseed2=0 if (js_iseed == 0) { now = new Date() js_iseed = now.getHours() + now.getMinutes() * 60 + now.getSeconds() * 3600 } js_iseed1 = js_iseed / js_m2 js_iseed2 = js_iseed % js_m2 var tmp = (((js_iseed2 * js_mult1 + js_iseed1 * js_mult2) % js_m2) * js_m2 + (js_iseed2 * js_mult2)) % js_m1 js_iseed = (tmp + 1) % js_m1 return (Math.floor((js_iseed/js_m1) * n)) } var numberOfAds = 3 //number or ads you want to display ads = new Array() for(var i=1; i<=numberOfAds; i++) { ads[i] = new create() } ads[1].width = "468" ads[1].height = "60" ads[1].src = "http://www.sudominio.com/imagenes/b-txwe2.gif" ads[1].href = "http://www.sudominio.com" ads[1].border = "0" ads[1].mouseover = "Ven a sudominio.com" ads[2].width = "468" ads[2].height = "60" ads[2].src = "http://www.sudominio.com/imagenes/b-carrux.gif" ads[2].href = "http://www.sudominio.com/carruxel" ads[2].border = "0" ads[2].mouseover = "Visita El CarruXel Erotico." var n = random(numberOfAds) n = (n==0) ? n+1 : n n = (n > numberOfAds) ? n-numberOfAds : n var image = ads[n] var ad = "" ad += '<a href="' + image.href + '" \n' ad += 'onMouseOver="self.status=\'' + image.mouseover + '\'\;return true" \n' ad += 'onMouseOut="self.status=\'\'"> \n' ad += '<img src="' + image.src + '" width=' + image.width ad += '\n height=' + image.height + ' border=' + image.border ad += '\n></a>' // -- End Hiding Here --> </script>

• Para llamar al banner

<script language="JavaScript"> <!-- Hide this script from old browsers -- document.write(ad) // -- End Hiding Here --> </script>

Cookies

• Mandar una 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 -->

Validar Formularios

• Validar formularios (comprueba que el campo e-mail incluya la arroba (@)

<!-- para llamarlo --> <form method="post" action="http://www.tudominio.com/cgi-bin/formail.cgi" onSubmit="return validar(this.email.value)"> <!-- funcion --> <SCRIPT LANGUAGE="JavaScript"> function validar(direccion) { if (direccion.indexOf("@") != -1) return true; else { alert('Debes escribir una dirección de e-mail válida'); return false; } } </SCRIPT>

• Validar Formularios Completo (mira longitud del campo, si incluye 

• caracteres prohibidos, la arroba, etc)

<!-- para llamarlo --> <form method="post" action="http://www.tudominio.com/cgi-bin/formail.cgi" onSubmit="return validar(this)"> <!-- funcion --> <script Language="JavaScript"><!-- function validar(formulario) { if (formulario.NOMBRE.value.length < 1) { alert("Escriba por lo menos 1 caracter en el campo \"nombre_usuario\"."); formulario.nombre_usuario.focus(); return (false); } var checkOK = "ABCDEFGHIJKLMNÑOPQRSTUVWXYZÁÉÍÓÚabcdefghijklmnñopqrstuvwxyzáéíóú "; var checkStr = formulario.nombre_usuario.value; var allValid = true; for (i = 0; i < checkStr.length; i++) { ch = checkStr.charAt(i); for (j = 0; j < checkOK.length; j++) if (ch == checkOK.charAt(j)) break; if (j == checkOK.length) { allValid = false; break; } } if (!allValid) { alert("Escriba sólo letra caracteres en el campo \"nombre_usuario\"."); formulario.nombre_usuario.focus(); return (false); } if (formulario.APELLIDO.value.length < 10) { alert("Escriba una URL correcta en el campo \"web_actual\"."); formulario.web_actual.focus(); return (false); } if ((formulario.EMAIL.value.indexOf ('@', 0) == -1)||(formulario.email.value.length < 5)) { alert("Debes escribir una dirección de e-mail válida en el campo \"email\"."); formulario.email.focus(); return (false); } return (true); } //--></script>

* Notas: El nombre del Formulario debe ser Formulario, y debes cambiar 

los campos NOMBRE, APELLIDO y EMAIL por los campos de tu formulario. 

Además incluye la función "on focus" que te lleva al campo que este mal

Mejoras Webmaster

• Hojas de Estilo (CSS) Guardar como un archivo *.css

A:link {text-decoration: none;} A:visited {text-decoration:none;} A:hover {text-decoration: underline; color="#FFFF00";} A:active {TEXT-DECORATION: none} BODY { scrollbar-base-color : #000000; scrollbar-arrow-color : #FFFFFF; } .nav { color : #FFCC00; font-size : 8pt;}

• Última modificación automática (escribe automáticamente la 

• fecha cuando lo guardas)

<script language="VBScript"> document.write "Este documento fue actualizado por última vez en: " document.write document.lastmodified </script>

Comprobaciones

• Algunas versiones de Netscape Navigator pueden provocar fallos 

• si se recarga la página o se cambia de tamaño

<script language="JavaScript"> <!-- function MM_reloadPage(init) { //reloads the window if Nav4 resized if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); } MM_reloadPage(true); // --> </script>

• Mirar si el navegador del visitante tiene flash (si tiene haces una cosa, sino otra)

<script language="JavaScript"> <!-- function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 var ok=false; document.MM_returnValue = false; with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { ok=(plugins && plugins[plgIn]); } else if (appVersion.indexOf('3.1')==-1) { //not Netscape or Win3.1 if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; else ok=autoGo; } if (!ok) theURL=altURL; if (theURL) window.location=theURL; } //--> </script> <!-- Y luego lo llamas en el body -->

Pavadas

• Texto que va cambiando de color

<script language="JavaScript"> <!-- function initArray() { for (var i = 0; i < initArray.arguments.length; i++) { this[i] = initArray.arguments[i]; } this.length = initArray.arguments.length; } // you may fill this colors array with your colors. // the script will rotate the links through these colors var colors = new initArray( "#0066FF", "#FF6600", "blue", "red", "purple", "black", "grey", "navy"); pause_time = .5; // in seconds link = 0; // starting color index (in colors array) for unvisited links vlink = 4; // starting color index (in colors array) for visited links function linkDance() { link = (link+1)%colors.length; vlink = (vlink+1)%colors.length; //alert("link "+link+"\r\nvlink "+vlink+"\r\nvlinkColor "+document.vlinkColor); document.linkColor = colors[link]; document.vlinkColor = colors[vlink]; setTimeout("linkDance();",pause_time*1000); } linkDance(); // --> </script>

• Un texto va siguiendo el puntero del ratón

<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>

• Terremoto (que la pantalla tiemble y se mueva)

<!-- 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>

• Cualquier imagen va moviéndose por la pantalla

<script language="JavaScript"> <!-- // number of time you want it to pop var test=0; var MAXHITS = 100000; var cookiename= "2208749"; var nHits = eval(getCookie(cookiename)); // get current count var expdate = new Date(); expdate.setTime(expdate.getTime() + (10 * 24 * 60 * 60 * 1000)); // setCookie function setCookie (name, value, expires) { if (!expires) expires = new Date(); document.cookie = name + "=" + escape (value) + "; expires=" + expires.toGMTString() + "; path=/"; } // number of page hits so far stored in cookie nHits += 1; setCookie(cookiename, nHits, expdate); // getCookie function getCookie (name) { var dcookie = document.cookie; var cname = name + "="; var clen = dcookie.length; var cbegin = 0; while (cbegin < clen) { var vbegin = cbegin + cname.length; if (dcookie.substring(cbegin, vbegin) == cname) { var vend = dcookie.indexOf (";", vbegin); if (vend == -1) vend = clen; return unescape(dcookie.substring(vbegin, vend)); } cbegin = dcookie.indexOf(" ", cbegin) + 1; if (cbegin == 0) break; } return null; } //** AOL aol_checkjd='Mozilla/4.61 [en] (WinNT; I)'; var ableToPop = true; if(aol_checkjd.indexOf("AOL") > 0) { ableToPop = false; } if (nHits > MAXHITS) { ableToPop = false; } //** browser ** bName = navigator.appName; bVer = parseInt(navigator.appVersion); version="n2"; if (bName == "Netscape" && bVer == 2) version = "n2"; if (bName == "Netscape" && bVer >= 3) version = "n3"; if (bName == "Microsoft Internet Explorer" && bVer >= 2) version = "e3"; if (bName == "Microsoft Internet Explorer" && bVer >= 4) version = "e4"; if ( version == "n2" || version == "e3" ) ableToPop = false; if (navigator.appName.indexOf("WebTV") > -1 ) ableToPop=false; if ( ableToPop ) { if (nHits==null) { setCookie (name, 1); var test=1;comenzar(); } else { if (nHits<=MAXHITS) { setCookie (name, ++nHits); var test=1; comenzar(); } } } var ns = (document.layers)? true:false; var ie = (document.all)? true:false; var puntox = 0; var puntoy = 0; var posx; var posy; function mover(x,y) { if (ns) { document.layers['mierda'].left = x; document.layers['mierda'].top = y; } else { document.all('mierda').style.posLeft = x; document.all('mierda').style.posTop = y; } } function destino() { puntox = puntobueno(600); puntoy = puntobueno(400); } function movimiento() { if (ns) { posx = document.layers['mierda'].left ; posy = document.layers['mierda'].top; } else { posx = document.all('mierda').style.posLeft; posy = document.all('mierda').style.posTop; } auxx=posx; auxy=posy; if ( (puntox-posx)>0 ) { auxx = posx + 1; } else { if ((puntox-posx)<0) { auxx = posx - 1; } } if ( (puntoy-posy)>0 ) { auxy = posy + 1; } else { if ((puntoy-posy)<0) { auxy = posy - 1; } } mover(auxx,auxy); } i=0; function comenzar() { if (!llegada()) { movimiento(); setTimeout('comenzar()',10); } else { destino(); setTimeout('comenzar()',10); } } function llegada() { if ( (posx==puntox) && (posy==puntoy) ) { return true; } else { return false; } } function puntobueno (coord) { valido = false; while (!valido) { punto = parseInt(Math.random() * 1000); if (punto<coord) { valido = true; } } return punto; } destino(); //--> </script> <!-- Inicio capa de 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="noticias.gif" border="0"></a>'); } </script>

Efecto Nieve (van cayendo copos de nieve)

<script> <!-- Original: Altan (snow@altan.hr) --> <!-- Web Site: http://www.altan.hr/snow --> <!-- Smaller flakes, subtle snowfall variables, code beautifcation and makeSnow function by NoSLZZP --> var no = 5; // snow number var speed = 15; // smaller number moves the snow faster var snowflake = "dot.gif"; var ns4up = (document.layers) ? 1 : 0; // browser sniffer var ie4up = (document.all) ? 1 : 0; var dx, xp, yp; // coordinate and position variables var am, stx, sty; // amplitude and step variables var i, doc_width = 400, doc_height = 500; if (ns4up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = 500; doc_height = 500; } dx = new Array(); xp = new Array(); yp = new Array(); am = new Array(); stx = new Array(); sty = new Array(); for (i = 0; i < no; ++ i) { dx[i] = 0; // set coordinate variables xp[i] = Math.random()*(doc_width-50); // set position variables yp[i] = Math.random()*doc_height; am[i] = Math.random()*20; // set amplitude variables stx[i] = 0.02 + Math.random()/10; // set step variables sty[i] = 0.7 + Math.random(); // set step variables if (ns4up) { // set layers if (i == 0) { document.write("<layer name=\"dot"+ i +"\" left=\"15\" "); document.write("top=\"15\" visibility=\"show\"><img src=\""); document.write(snowflake + "\" border=\"0\"></layer>"); } else { document.write("<layer name=\"dot"+ i +"\" left=\"15\" "); document.write("top=\"15\" visibility=\"show\"><img src=\""); document.write(snowflake + "\" border=\"0\"></layer>"); } } else if (ie4up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\""); document.write(snowflake + "\" border=\"0\"></div>"); } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\""); document.write(snowflake + "\" border=\"0\"></div>"); } } } function snowNS() { // Netscape main animation function for (i = 0; i < no; ++ i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = self.innerWidth; doc_height = self.innerHeight; } dx[i] += stx[i]; document.layers["dot"+i].top = yp[i]; document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("snowNS()", speed); } function snowIE() { // IE main animation function for (i = 0; i < no; ++ i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx[i] += stx[i]; document.all["dot"+i].style.pixelTop = yp[i]; document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("snowIE()", speed); } if (ns4up) { snowNS(); } else if (ie4up) { snowIE(); } </script> <!-- Falta la imagen del copo de nieve, consiguela en http://www.altan.hr/snow -->

HTML Dinámico

• Efectos DHTML

<META http-equiv="Page-Enter" content="RevealTrans (Duration=3, Transition=23)"> Explicación: Page-Enter indica que el efecto sucederá cuando alguien entre en la pagina. También puede indicarse en su lugar Page-Exit y entonces la animación sucederá cuando se abandone la pagina. (Esto es mas odioso todavía si cabe... pues si nos vamos a otro sitio, puede parecer que la transición la tiene de entrada el nuevo sitio y no el que abandonamos) Duration=X indica la duración del efecto. X en segundos. Ponga 31536000 y la transición durara un año. Transition=Y indica el efecto a realizar. Hay 23 diferentes mas un valor para aleatorio.

• Diferentes Tipos

 Los diferentes efectos (Y) son los siguientes: