ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
Codigos para html
1. CODIGOS <HTML>
PARA QUE LO BAJES A TU PAGINAS SOLO COPIALO Y PEGALO EN TU FUENTE <HTML>
Con este código vamos a impedir que los visitantes seleccionen el texto de nuestra página para
luego copiarlo a otro lado.
<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>
Con este código insertamos un pequeño relojito que indica la cuenta regresiva de las horas,
minutos y segundos que faltan para finalizar el día.
<body>
<p>El reloj...</p>
<form name="Reloj">
<input type="text" size="7" name="tiempo" value="mm:hh:ss" title="Tiempo restante para
finalizar el día">
<script language="JavaScript">
<!--
var tiempoAtras;
updateReloj();
function updateReloj() {
var tiempo = new Date();
var hora = 23-tiempo.getHours();
var minutos = 59-tiempo.getMinutes();
var segundos = 59-tiempo.getSeconds();
tiempoAtras= (hora < 10) ? hora :hora;
tiempoAtras+= ((minutos < 10) ? ":0" : ":") + minutos;
tiempoAtras+= ((segundos < 10) ? ":0" : ":") + segundos;
document.Reloj.tiempo.value = tiempoAtras;
setTimeout("updateReloj()",1000);
}
//-->
</script>
</form>
</body>
2. Con este código podemos hacer que si a un visitante le gustó nuestra Web, la recomiende a un
amigo escribiendo su dirección de correo electrónico en la casilla, al hacer click en "Recomendar
esta Web" se envía un mensaje de correo con el asunto "Pienso que te puede interesar esta
página..." y en el cuerpo del mensaje aparece la dirección completa donde se encuentra el código y
el título de la misma.
<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="Recomendá esta Web!" onClick="mailThisUrl();">
</form>
<script language="JavaScript1.2">
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>
Sorprendé a tus visitantes con este asombroso truco. Al pasar el mouse sobre el link, aparece la
explicación de ese link en un cuadro con la cantidad de palabras que queramos poner. Solo tenés
que reemplazar mis direcciones por las tuyas, y el texto deseado por el tuyo.
<p>
<script language="JavaScript"><!--
function escribe(frase){document.desplaza.cuadro.value=frase; }
// --></script>
</p>
<table border="0">
<tr>
3. <td width="200"><p align="center"><strong>Opciones.</strong></p>
<p><a href="http://www.CheNico.com"
onmouseover="escribe(' Página principaln ----------------nn Cuando hagas Click en este enlace irás
directamente a la página de inicio de mi web');">Página
principal</a><br>
<a href="http://usuarios.lycos.es/pauluk/trucosprin.htm"
onmouseover="escribe(' Trucos PCn -----------nn Este enlace te llevará a la página de Trucos PC en
la que podés encontrar muchos más trucos interesantes para realizar e incluir en tus páginas
web');">Trucos PC</a><br>
<a href="http://usuarios.lycos.es/pauluk/GLOSARIO.HTM"
onmouseover="escribe(' Glosarion -------------- nn Diccionario de Términos Informáticos. Enterate el
significado de esas palabras de computación que decís todos los días pero que no sabés
exactamente qué significa.');">Glosario</a><br>
</p>
</td>
<td><form name="desplaza">
<p><textarea name="cuadro" rows="8" cols="30"
wrap="physical"></textarea></p>
</form>
</td>
</tr>
</table>
Con éste código van a conseguir cambiar el clásico color gris de la barra de desplazamiento de la
derecha y abajo por el color que quieran. Para cambiar de colores, cambien el número 000000 por
otros, cada color tiene su número, pero la lista es muy larga, así que prueben con los número que
ya van a encontrar el deseado.
<style>
<!--
BODY { scrollbar-base-color : #000000;
scrollbar-arrow-color : #FFFFFF; }
.nav {
color : #FFCC00;
font-size : 8pt;}
-->
</style>
Aprendé a incluir la fecha en tu sitio sin necesidad de actualizarla cada día. Sólo tenés que usar un
JavaScript que automáticamente exhibirá la fecha del día en tu página cada vez que ésta se abra.
No tenés que preocuparte con ninguna configuración. Sólo tenés que copiar y pegar el código en tu
página.
<script language="JavaScript">
<!--
mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;
if(myday == 0)
day = " Domingo, "
4. else if(myday == 1)
day = " Lunes, "
else if(myday == 2)
day = " Martes, "
else if(myday == 3)
day = " Miércoles, "
else if(myday == 4)
day = " Jueves, "
else if(myday == 5)
day = " Viernes, "
else if(myday == 6)
day = " Sábado, "
if(mymonth == 0)
month = "Enero "
else if(mymonth ==1)
month = "Febrero "
else if(mymonth ==2)
month = "Marzo "
else if(mymonth ==3)
month = "Abril "
else if(mymonth ==4)
month = "Mayo "
else if(mymonth ==5)
month = "Junio "
else if(mymonth ==6)
month = "Julio "
else if(mymonth ==7)
month = "Agosto "
else if(mymonth ==8)
month = "Setiembre "
else if(mymonth ==9)
month = "Octubre "
else if(mymonth ==10)
month = "Noviembre "
else if(mymonth ==11)
month = "Diciembre "
document.write("<font size=1>"+ day);
document.write(myweekday+" de "+month+ "</font>");
// -->
</script>
Con este recurso personalizás tu sitio para el visitante. Al entrar, el visitante verá un espacio para
ingresar su nombre y un mensaje que dice "Hola, Fulano".
Copiá el siguiente código y pégalo donde quieras que aparezca el mensaje:
<Script language="JavaScript">
mensagem = prompt("Por favor, ingresa tu nombre",'');
if (mensagem==null) {
document.write("¡Hola, visitante!")
}else{
if (mensagem=='') {
document.write("<b><font size=2 color=#000000>¡Hola, visitante!</font></b>")
}else{
document.write("<b><font size=2 color=#000000>¡Hola"+mensagem+"! Bienvenido a mi
sitio</font></b>");
5. }
}
</script>
Atrás y Adelante:
Atrás:
<a href="javascript:history.go(-1)">Atrás </a>
Adelante:
<a href="javascript:history.go(1)">Adelante</a>
Puedes poner en tu sitio un mensaje personalizado según la hora en que el visitante entre. Este
puede recibir el saludo "Buen día", "Buenas tardes", "Buenas noches", o puedes sustituirlos
por otros mensajes de tu preferencia. De esta forma el visitante verá el mensaje de acuerdo con el
horario que entre a tu página.
<Font size=2><Script Language="JavaScript">
<!--
today = new Date()
if(today.getMinutes() < 10){
pad = "0"}
else
pad = "";
document.write ;if((today.getHours() >=6) && (today.getHours() <=9)){
document.write("¡Buen día!")
}
if((today.getHours() >=10) && (today.getHours() <=11)){
document.write("¡Buen día!")
}
if((today.getHours() >=12) && (today.getHours() <=19)){
document.write("¡Buenas tardes!")
}
if((today.getHours() >=20) && (today.getHours() <=23)){
document.write("¡Buenas noches!")
}
if((today.getHours() >=0) && (today.getHours() <=3)){
document.write("¡Buenas noches!")
}
if((today.getHours() >=4) && (today.getHours() <=5)){
document.write("¡Buenas noches!")
}
// -->
</script>
</b></font>
Con este recurso es posible hacer que, a cada visita a tu página, el usuario vea una imagen
diferente sin necesidad de actualizar tu sitio a cada momento.
Imágenes aleatórias con enlaces: Pegá el siguiente código en tu página HTML. Podés pegarlo
donde quieras que aparezcan las imágenes.
6. <Script Language="JavaScript">
hoje = new Date()
numero_de_imagens = 2
segundos = hoje.getSeconds()
numero = segundos % numero_de_imagens
if (numero == 0){
banner = "Ingresa el nombre de la imagen 1 aqui"
link = "http://"
alvo = "_self"
}
if (numero == 1){
banner = "Ingresa el nombre de la imagen 2 aqui"
link = "http://"
alvo = "_self"
}
document.write('<a href="' + link + '" target="' + alvo + '" ><img src="' + banner + '"
border=0></a>')
</script>
WwW.pAgInAsGrAtIs.Es.Tl
Si queremos poner archivos para que los visitantes los puedan descargar a sus computadoras, solo
debemos subir ese archivo a nuestro servidor e insertar en nuestra Web el siguiente código HTML:
<a href="ejemplo.exe">Descripción del enlace </a>
No existe un comando que inicie la descarga. Lo que sucede es que, siempre que aparece un tipo
de archivo no reconocido por el navegador, este comienza a descargarlo automáticamente.
Ejemplo: Si el navegador no logra abrir un archivo "zip" (compactado), inicia la descarga
automáticamente.
Con este código podemos lograr ese tan conocido efecto que al pasar el mouse sobre un link, este
se subraye. Podemos hacer que tenga un color antes de visitar el link, y que tenga otro una vez
visitado.
<STYLE type="text/css">
<!--
A:link {COLOR: red; TEXT-DECORATION: none}
A:visited {COLOR: gray; TEXT-DECORATION: none}
A:active {TEXT-DECORATION: none}
A:hover {COLOR: blue; TEXT-DECORATION: underline} -->
</STYLE>
</p>
<p><a href="l1.htm">El texto que quieras.</a><br>
<a href="l2.htm">otro texto.</a><br>
<a href="l3.htm">Otro texto.</a><br>
</p>
Transformá la clásica flechita de Windows en una mira de disparo.
<style type="text/css">
<!--
body { cursor: crosshair}
-->
</style>
7. A continuación veremos otro código para ponerle color a la barra de desplazamiento, en este caso
vamos a poder personalizar los colores de la barra, del fondo y los bordes. Reemplazar los nombres
de los colores por otros o por los código de letras y números. Mas abajo está la tabla de colores.
<style>
<!--
body { scrollbar-face-color: darkgreen ;
scrollbar-shadow-color: yellow;
scrollbar-highlight-color: violet;
scrollbar-3dlight-color: navy;
scrollbar-darkshadow-color: magenta;
scrollbar-track-color: blue;
scrollbar-arrow-color: black }
-->
</style>
Aprendé a dar movimiento a tu página con botones animados por Java Script. Cada botón puede
llevar a un enlace distinto. Sólo tienes que configurar los parámetros "lineArr" y "urlArr" del
script, que permiten destacar cosas en tu página.
<font size="2">
<script language="JavaScript">
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineNo = 0
var lineMax = 3
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)
lineArr[1] = "Pauluk Computación"
urlArr[1] = "http://www.CheNico.com"
lineArr[2] = "Trucos PC"
urlArr[2] = "http://www.pauluk.8k.com/trucosprin.htm"
lineArr[3] = "Noticias Tecnológicas y Actualidad"
urlArr[3] = "http://www.pauluk.8k.com/noticias.htm"
var lineText = lineArr[1]
function StartShow() {
StopShow()
ShowLine()
timerRunning = true
}
function FillSpaces() {
for (var i = 1; i <= lineWidth; i++) {
spaces += " "
}
}
function StopShow() {
if (timerRunning) {
clearTimeout(timerID)
timerRunning = false
}
}
function ShowLine() {
if (charNo == 0) {
8. if (lineNo < lineMax) {
lineNo++
}
else {
lineNo = 1
}
lineText = lineArr[lineNo]
charMax = lineText.length
}
if (charNo <= charMax) {
document.formDisplay.buttonFace.value = lineText.substring(0, charNo)
charNo++
timerID = setTimeout("ShowLine()", 100)
}
else {
charNo = 0
timerID = setTimeout("ShowLine()", 3000)
}
}
function GotoUrl(url)
{
top.location.href = url
}
document.write("<form name="formDisplay">");
document.write("<input type="button" name="buttonFace" value="&{lineText}" size="18"
onClick="GotoUrl(urlArr[lineNo])">");
document.write("</form>");
StartShow();
</script></font>
Al insertar este código, cada vez que entremos en la Web se producirá una especie de terremoto en
el explorador. Un efecto interesante para atraer la atención de nuestros visitantes.
<html>
<head>
<title>www.CheNico.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p>
<script language="JavaScript1.2">
function tremer(n) {
if (self.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.moveBy(0,i);
self.moveBy(i,0);
9. self.moveBy(0,-i);
self.moveBy(-i,0);
}}}}
tremer(5)
</script>
<Script language=JavaScript>
function right(e) {
if (navigator.appName == 'Netscape' && (e.which == 3 || e.which == 2)){
alert("www.CheNico.com");
return false;
}
else if (navigator.appName == 'Microsoft Internet Explorer' &&
(event.button == 2 || event.button == 3)) {
alert("www.CheNico.com");
return false;
}
return true;
}
document.onmousedown=right;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=right;
</script>
</body>
</html>
Este efecto hace que cualquier imagen que elijas quede "paseando" por la pantalla, siendo un
recurso excelente tanto para llamar la atención por alguna novedad en tu sitio como para darle más
movimiento a la página.
Copiá y pegá el siguiente código en tu página HTML.
Recordá que la imagen debe estar en el mismo directorio de tu página html.
10. <SCRIPT language="JavaScript1.2">
var imagem="Ingresa el nombre del archivo de imagen aquí"
if (document.layers)
{document.write("<LAYER NAME='animacao' LEFT=10 TOP=10><img src='"+imagem+"'
></LAYER>")}
else if (document.all){document.write("<div id='animacao'
style='position:absolute;top:10px;left:10px;width:17px;height:22px;z-index:50'><img
src='"+imagem+"'></div>")}
conta=-1;
move=1;
function curva(){
abc=new Array(0,1,1,1,2,3,4,0,6,-1,-1,-1,-2,-3,-4,0,-6)
for (i=0; i < abc.length; i++)
{var C=Math.round(Math.random()*[i])}
iniciar=abc[C];
setTimeout('curva()',1900);
return iniciar;
}
ypos=10;
xpos=10;
movimento = 60;
function moveR(){
caminho=movimento+=iniciar;
y = 4*Math.sin(caminho*Math.PI/180);
x = 6*Math.cos(caminho*Math.PI/180);
if (document.layers){
ypos+=y;
xpos+=x;
document.animacao.top=ypos+window.pageYOffset;
document.animacao.left=xpos+window.pageXOffset;
}
else if (document.all){
ypos+=y;
xpos+=x;
document.all.animacao.style.top=ypos+document.body.scrollTop;
document.all.animacao.style.left=xpos+document.body.scrollLeft;
}
T=setTimeout('moveR()',50);
}
function edges(){
if (document.layers){
if (document.animacao.left >= window.innerWidth-
40+window.pageXOffset)movimento=Math.round(Math.random()*45+157.5);
if (document.animacao.top >= window.innerHeight-
30+window.pageYOffset)movimento=Math.round(Math.random()*45-112.5);
if (document.animacao.top <= 2+window.pageYOffset) movimento =
Math.round(Math.random()*45+67.5);//OK!
if (document.animacao.left <= 2+window.pageXOffset) movimento =
Math.round(Math.random()*45-22.5);//OK!
}
else if (document.all)
{
if (document.all.animacao.style.pixelLeft >= document.body.offsetWidth-
11. 45+document.body.scrollLeft)movimento=Math.round(Math.random()*45+157.5);
if (document.all.animacao.style.pixelTop >= document.body.offsetHeight-
35+document.body.scrollTop)movimento=Math.round(Math.random()*45-112.5);
if (document.all.animacao.style.pixelTop <= 2+document.body.scrollTop) movimento =
Math.round(Math.random()*45+67.5);//OK!
if (document.all.animacao.style.pixelLeft <= 2+document.body.scrollLeft) movimento =
Math.round(Math.random()*45-22.5);//OK!
}
setTimeout('edges()',100);
}
function efeito(){
curva();
moveR();// onUnload="opener.gO()"
edges();
}
if (document.all||document.layers)
efeito()
</script>
Colocá en tu página mensajes animados que se agrandan y llaman la atención de los visitantes.
Además, incluyen enlaces hacia donde vos quieras.
Copiá el siguiente código y pegalo en tus páginas debajo de la etiqueta <Body>.
<script language="JavaScript">
var velocidade = 45;
var ciclo = 2000;
var tamanho = 20;
var x = 0;
var y = 0;
var mensagens, 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 mensagens2 = new initArray(
"Visita",
"www.CheNico.com",
"webmaster@pauluk.8k.com"
);
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 aumenta(){
mensagens = mensagens2[y];
if (x < tamanho) {
x++;
setTimeout("aumenta()",velocidade);
12. }
else setTimeout("diminui()",ciclo);
if(navigator.appName == "Netscape") {
size = "<font color=#000099 point-size='"+x+"pt'>";
document.wds.document.write(size+"<center><a href=http://www.CheNico.com Target=_blank
style=text-decoration:none;color:#000099>"+mensagens+"</a></center>"+esize);
document.wds.document.close();
}
if (navigator.appVersion.indexOf("MSIE") != -1){
wds.innerHTML = "<font color=#000099><center><a href=http://www.CheNico.com
Target=_blank style=text-
decoration:none;color:#000099>"+mensagens+"</a></center></font>";
wds.style.fontSize=x+'px'
}
}
function diminui(){
if (x > 1) {
x--;
setTimeout("diminui()",velocidade);
}
else {
setTimeout("aumenta()",ciclo);
y++;
if (y > mensagens2.length - 1) y = 0;
}
if(navigator.appName == "Netscape") {
size = "<font color=#000099 point-size='"+x+"pt'>";
document.wds.document.write(size+"<center><a href=http://www.CheNico.com Target=_blank
style=text-decoration:none;color:#000099>"+mensagens+"</a></center>"+esize);
document.wds.document.close();
}
if (navigator.appVersion.indexOf("MSIE") != -1){
wds.innerHTML = "<font color=#000099><center><a href=http://www.CheNico.com
Target=_blank style=text-
decoration:none;color:#000099>"+mensagens+"</a></center></font>";
wds.style.fontSize=x+'px'
}
}
setTimeout("aumenta()",velocidade);
</script>
Este es un excelente recurso. Podés proteger tus páginas con una clave. Así podés definir
exactamente quienes entrarán a tu página. No tenés que preocuparte por configuraciones. Es muy
sencillo: la clave siempre será el nombre de tu página sin la extensión .htm, es decir, si la página
tiene el nombre de "ejemplo.htm", la clave será "ejemplo". ¿Ves que fácil?.
Para tener este recurso en tu sitio debes incluir un código en la página de "entrada" en donde el
visitante ingresará la clave, y enviar a tu sitio el archivo de la página que será cargada.
<Form name="frm">
<center>
<Script Language="JavaScript">
<!--
//
function loadpage(){