Otra barra con mas colores:
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>
Observación: para ver este truco, es necesario tener instalada las últimas versiones de los navegadores. Preferentemente Internet Explorer 6.
Abrir un link de una imagen en una ventana nueva:
Con este código podemos insertar una imagen (ej. banner) y que al hacer click sobre ella se abra el link de destino en una ventana nueva. Primero ponemos la ruta del link de destino, y luego la ruta donde está alojada la imagen. Si está alojada en la raíz de nuestro servidor solo ponemos el nombre y listo.
<a href="http://www.CheNico.com
" target="_blank"><img src="imagen.gif" border=0></a>
Hora y texto en la barra de estado:
Con este truco, podemos hacer que aparezca en la barra de estado la hora de la PC que entra a nuestra Web y poner el texto que queramos.
<script language="JavaScript">
<!--
mensaje=" |======| www.CheNico.com "
function hora() {
var h = new Date();
window.status="|======| "
+ h.getHours() +":"+ h.getMinutes() +"" +mensaje ;
window.setTimeout('hora()',100);
}
hora()
//-->
</script>
Botón animado:
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 face="Arial, Helvetica, sans-serif" 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) {
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>
Letrero de mensajes:
Este es un efecto muy fácil de lograr y muy funcional para tu página. Podés definir cuántos textos y enlaces quieras. Ellos se destacarán y tu página quedará mucho más dinámica. Podés ver cómo personalizar este recurso al final de esta página. Es mejor que Java ya que es mucho más liviano y rápido de cargarse, y no necesita archivos adicionales.
Para incluir este recurso en tu página debes seguir dos pasos:
Paso 1: Incluye el siguiente código en tu etiqueta "<BODY>", agrega un espacio después del último parámetro e incluye:
onload="if (document.all||document.layers) {regenerate2();update()}"
Observa un ejemplo sencillo de cómo quedaría la etiqueta:
<body onload="if (document.all||document.layers) {regenerate2();update()}">
Paso 2: Pega en tu página HTML el siguiente código personalizando las partes indicadas:
<style>
<!--
#mensagem{
position:relative;
layer-background-color:black;
width:400;
height:12;
}
#submensagem{
background-color:black;
position:absolute;
border: 1px solid black;
width:400;
height:12;
}
.submensagemfont{
font:bold 12px Verdana;
text-decoration:none;
color:white;
}
.submensagemfont a{
top:0;
color:white;
text-decoration:none;
}
-->
</style>
<div id="mensagem">
<div id="submensagem" class="submensagemfont">Iniciando...</div>
</div>
<script language="JavaScript1.2">
var speed=4500
var textos=new Array()
textos[0]="<center><a href='Enlace1 Aquí'>Descripción del enlace1 aquí</a></center>"
textos[1]="<center><a href='Enlace2 Aquí'>Descripción del enlace2 aquí</a></center>"
textos[2]="<center><a href='Enlace3 Aquí'>Descripción del enlace3 aquí</a></center>"
i=0
if (document.all)
tickerobject=document.all.submensagem.style
else
tickerobject=document.mensagem.document
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",450)
}
function update(){
BgFade(0xff,0xff,0xff, 0x00,0x00,0x00,10);
if (document.layers){
document.mensagem.document.submensagem.document.write('<span class="submensagemfont">'+textos[i]+'</span>')
document.mensagem.document.submensagem.document.close()
}
else
document.all.submensagem.innerHTML=textos[i]
if (i<textos.length-1)
i++
else
i=0
setTimeout("update()",speed)
}
function BgFade(red1, grn1, blu1, red2,
grn2, blu2, steps) {
sred = red1; sgrn = grn1; sblu = blu1;
ered = red2; egrn = grn2; eblu = blu2;
inc = steps;
step = 0;
RunFader();
}
function RunFader() {
var epct = step/inc;
var spct = 1 - epct;
if (document.layers)
tickerobject.bgColor =
Math.floor(sred * spct + ered *
epct)*256*256 +
Math.floor(sgrn * spct + egrn * epct)*256 +
Math.floor(sblu * spct + eblu * epct);
else
tickerobject.backgroundColor=
Math.floor(sred * spct + ered *
epct)*256*256 +
Math.floor(sgrn * spct + egrn * epct)*256 +
Math.floor(sblu * spct + eblu * epct);
if ( step < inc ) {
setTimeout('RunFader()',50);
}
step++;
}
</script>
Pantalla que tiembla:
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);
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>
Botón Colorido:
¿Cansado del botón siempre gris? Ahora con CSS podés definir cualquier color para tus botones. Ellos combinarán más con tu página y son muy fáciles de crear.
Copia el código que sigue y pegalo dentro de la etiqueta de formulario de tu página:
<input type="submit" name="button" value="www.CheNico.com" style="color: #000000; background-color: #FF9900">
Texto que sigue al mouse:
Hacé que un texto cualquiera siga al mouse del visitante en tu página. Es un efecto fabuloso y fácil de incluir en las páginas
Incluye el siguiente código en tu página HTML:
<style>
.animado {position:absolute;visibility:visible;top:-50px;font-size:10pt;font-family:Arial;font-weight:bold;color:black;}
</style>
<script language=JavaScript>
var x,y
var tempo=10
var espera=0
var texto="www.CheNico.com"
texto=texto.split("")
var xpos=new Array()
for (i=0;i<=texto.length-1;i++) {
xpos[i]=-50
}
var ypos=new Array()
for (i=0;i<=texto.length-1;i++) {
ypos[i]=-50
}
function seguir(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
espera=1
}
function animar_cursor() {
if (espera==1 && document.all) {
for (i=texto.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+tempo
ypos[i]=ypos[i-1]
}
xpos[0]=x+tempo
ypos[0]=y
for (i=0; i<texto.length-1; i++) {
var camada = eval("span"+(i)+".style")
camada.posLeft=xpos[i]
camada.posTop=ypos[i]
}
}
else if (espera==1 && document.layers) {
for (i=texto.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+tempo
ypos[i]=ypos[i-1]
}
xpos[0]=x+tempo
ypos[0]=y
for (i=0; i<texto.length-1; i++) {
var camada = eval("document.span"+i)
camada.left=xpos[i]
camada.top=ypos[i]
}
}
var timer=setTimeout("animar_cursor()",30)
}
</script>
<script Language=JavaScript>
for (i=0;i<=texto.length-1;i++) {
document.write("<span id='span"+i+"' class='animado'>")
document.write(texto[i])
document.write("</span>")
}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = seguir;
animar_cursor()
</script>
Imagen volando por la pantalla:
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.
<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-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>
Texto en expansión:
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);
}
else setTimeout("diminui()",ciclo);
if(navigator.appName == "Netscape") {
size = "<font face=arial 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 face=arial 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 face=arial 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 face=arial 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>
Página protegida por clave:
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(){
var psj=0;
newwin = window.open(document.frm.pswd.value + ".htm")
}
//-->
</script>
Ingresa tu clave:
<input
type="password" name="pswd" size="20">
</center>
<center>
<p>
<input type="button" value="Entra"
onClick="loadpage()" name="button">
</p>
</center>
</form>
Cambiar el color de la barra de desplazamiento al pasar el mouse:
Con este truco podés hacer que además de cambiar el color clásico gris de la barra de desplazamiento por otro, hacer que cuando el mouse se pose sobre ella cambie a otro color. Cambiando los números y letras en verde variaran los colores. Probalo pasando por la barra de la derecha!.
<script language="JavaScript1.2">
<!--
function scrollBar(line,face,theme)
{
if (!line||!face)
{
line=null;
face=null;
switch(theme)
{
case "blue":
var line="black";
var face="#6699FF";
break;
}
}
with(document.body.style)
{
scrollbarDarkShadowColor=line;
scrollbar3dLightColor=line;
scrollbarArrowColor="black";
scrollbarBaseColor=face;
scrollbarFaceColor=face;
scrollbarHighlightColor=face;
scrollbarShadowColor=face;
scrollbarTrackColor="#FFFFFF";
}
}
function colorBar(){
var w = document.body.clientWidth;
var h = document.body.clientHeight;
var x = event.clientX;
var y = event.clientY;
if(x>w) scrollBar('#000080','#E58D28');
else scrollBar(null,null,"blue");
}
if (document.all){
scrollBar(null,null,"blue");
document.onmousemove=colorBar;
}
//-->
</script>"#6699FF";
break;
}
}
with(document.body.style)
{
scrollbarDarkShadowColor=line;
scrollbar3dLightColor=line;
scrollbarArrowColor="black";
scrollbarBaseColor=face;
scrollbarFaceColor=face;
scrollbarHighlightColor=face;
scrollbarShadowColor=face;
scrollbarTrackColor="#FFFFFF";
}
}
function colorBar(){
var w = document.body.clientWidth;
var h = document.body.clientHeight;
var x = event.clientX;
var y = event.clientY;
if(x>w) scrollBar('#000080','#E58D28');
else scrollBar(null,null,"blue");
}
if (document.all){
scrollBar(null,null,"blue");
document.onmousemove=colorBar;
}
//-->
</script>
Cambiar el color de la barra de desplazamiento:
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>
Reloj - formato texto:
Este es otro tipo de reloj que también cuenta los segundos y que puede utilizar texto. Es muy fácil incluirlo en tu página. Siempre que un usuario acceda a tu sitio el efecto será iniciado.
Paso 1: Para que el recurso se inicie junto con la página, debes incluir dentro de la etiqueta <body> el parámetro de inicio. Agregá un espacio después del último parámetro e incluye:
Onload="show5()"
Observa un ejemplo sencillo de cómo queda la etiqueta:
<body Onload="show5()">
¡Atención! Sin eso tu reloj no funcionará.
Paso 2: Incluye el siguiente código en tu página después de la etiqueta <body>.
<Font face=Verdana><span id=relogio style="POSITION: absolute"></span>
<Script Language=JavaScript>
<!--
function show5(){
if (!document.layers&&!document.all)
return
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var dn="AM"
if (hours>12){
dn="PM"
hours=hours-12
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
meurelogio="<font size='5' face='Arial'><b>"+hours+":"+minutes+":"
+seconds+" "+dn+"</b></font>"
if (document.layers){
document.layers.relogio.document.write(meurelogio)
document.layers.relogio.document.close()
}
else if (document.all)
relogio.innerHTML=meurelogio
setTimeout("show5()",1000)
}
//-->
</script>
</font>
Poniendo fecha en tu sitio:
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, "
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 face=arial, size=1>"+ day);
document.write(myweekday+" de "+month+ "</font>");
// -->
</script>
Mensaje de bienvenida:
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 face=arial size=2 color=#000000>¡Hola, visitante!</font></b>")
}else{
document.write("<b><font face=arial size=2 color=#000000>¡Hola"+mensagem+"! Bienvenido a mi sitio</font></b>");
}
}
</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>
Imprimir pagina actual:
<a href="javascript:print()">Imprimir</a>
Cartel de novedades:
Este efecto te permite tener un cartel o letrero de mensajes incluyendo enlaces para tu sitio. Los mensajes van cruzando la pantalla como si fueran noticias; es un recurso excelente para destacar características especiales de tu sitio. Cada mensaje tendrá un enlace
Paso 1: Copiá el siguiente código y pegalo en tu página:
<script language="JavaScript1.2">
var largura=150
var altura=120
var bgcolor='white'
var fundo=''
var mensagens=new Array()
mensagens[0]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 1 aquí'>Coloca el texto del enlace 1 aquí</a></font></center>"
mensagens[1]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 2 aquí'>Coloca el texto del enlace 2 aquí</a></font></center>"
mensagens[2]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 3 aquí'>Coloca el texto del enlace 3 aquí</a></font></center>"
mensagens[3]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 4 aquí'>Coloca el texto del enlace 4 aquí</a></font></center>"
mensagens[4]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 5 aquí'>Coloca el texto del enlace 5 aquí</a></font></center>"
if (mensagens.length>1)
i=2
else
i=0
function mover1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("mover1(tlayer)",3000)
setTimeout("mover2(document.principal.document.segundo)",3000)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("mover1(tlayer)",100)
}
else{
tlayer.top=altura
tlayer.document.write(mensagens[i])
tlayer.document.close()
if (i==mensagens.length-1)
i=0
else
i++
}
}
function mover2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("mover2(tlayer2)",3000)
setTimeout("mover1(document.principal.document.primeiro)",3000)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("mover2(tlayer2)",100)
}
else{
tlayer2.top=altura
tlayer2.document.write(mensagens[i])
tlayer2.document.close()
if (i==mensagens.length-1)
i=0
else
i++
}
}
function mover3(whichdiv){
tdiv=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){
tdiv.style.pixelTop=0
setTimeout("mover3(tdiv)",3000)
setTimeout("mover4(segundo2)",3000)
return
}
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){
tdiv.style.pixelTop-=5
setTimeout("mover3(tdiv)",100)
}
else{
tdiv.style.pixelTop=altura
tdiv.innerHTML=mensagens[i]
if (i==mensagens.length-1)
i=0
else
i++
}
}
function mover4(whichdiv){
tdiv2=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){
tdiv2.style.pixelTop=0
setTimeout("mover4(tdiv2)",3000)
setTimeout("mover3(primeiro2)",3000)
return
}
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){
tdiv2.style.pixelTop-=5
setTimeout("mover4(segundo2)",100)
}
else{
tdiv2.style.pixelTop=altura
tdiv2.innerHTML=mensagens[i]
if (i==mensagens.length-1)
i=0
else
i++
}
}
function iniciar(){
if (document.all){
mover3(primeiro2)
segundo2.style.top=altura
segundo2.style.visibility='visible'
}
else if (document.layers){
document.principal.visibility='show'
mover1(document.principal.document.primeiro)
document.principal.document.segundo.top=altura+5
document.principal.document.segundo.visibility='show'
}
}
</script>
<table width="150" border="1" cellspacing="1" cellpadding="0">
<tr>
<td>
<ilayer id="principal" width=&{largura}; height=&{altura}; bgColor=&{bgcolor}; background=&{fundo}; visibility=hide>
<layer id="primeiro" left=0 top=1 width=&{largura};>
<script language="JavaScript1.2">
if (document.layers)
document.write(mensagens[0])
</script>
</layer>
<layer id="segundo" left=0 top=0 width=&{largura}; visibility=hide>
<script language="JavaScript1.2">
if (document.layers)
document.write(mensagens[1])
</script>
</layer>
</ilayer>
<script language="JavaScript1.2">
if (document.all){
document.writeln('<span id="principal2" style="position:relative;width:'+largura+';height:'+altura+';overflow:hiden;background-color:'+bgcolor+' ;background-image:url('+fundo+')">')
document.writeln('<div style="position:absolute;width:'+largura+';height:'+altura+';clip:rect(0 '+largura+' '+altura+' 0);left:0;top:0">')
document.writeln('<div id="primeiro2" style="position:absolute;width:'+largura+';left:0;top:1;">')
document.write(mensagens[0])
document.writeln('</div>')
document.writeln('<div id="segundo2" style="position:absolute;width:'+largura+';left:0;top:0;visibility:hidden">')
document.write(mensagens[1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</span>')
}
iniciar()
</script>
</td>
</tr>
</table>>
Personalizando: Para cambiar el color de fondo o incluir una imagen de fondo, observa esta parte del código:
var largura=150
var altura=120
var bgcolor='white'
var fundo=''
Donde dice "white" podés ingresar el valor hexadecimal del nuevo color; por ejemplo: #FFCC00
En "fondo" podés colocar el nombre de la imagen de fondo del letrero; por ejemplo:
var largura=150
var altura=120
var bgcolor='white'
var fundo='Nombre del archivo de imagen'
Para incluir más mensajes en el letrero, observá que el último mensaje aparece de la siguiente forma:
mensagens[4]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 5 aquí'>Coloca el texto del enlace 5 aquí</a></font></center>"
Sólo tenés que agregar una unidad al número indicado al final del mensaje. Por ejemplo:
mensagens[5]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 5 aquí'>Coloca el texto del enlace 5 aquí</a></font></center>"
mensagens[6]="<center><font face='Arial' size=2><a href='Coloca la dirección de la página 6 aquí'>Coloca el texto del enlace 6 aquí</a></font></center>"
Seguí hasta llegar al número total de mensajes que desees incluir.
Barra de estado fija:
Podés colocar la palabra o el mensaje que quieras en la barra de estado de tu sitio y mantenerlo fijo. De esta forma tu sitio quedará mucho más personalizado, además de contar con otras ventajas. Por ejemplo: el visitante no verá la dirección del enlace al que está apuntando, sólo el mensaje definido por vos.
<Script language="JavaScript">
statuss();
function statuss()
{
window.status = "www.pauluk.8k.com - Un Sitio. Muchas Opciones.";
setTimeout("statuss()", 1);
}
</script>
Alerta
<html>
<head>
<title>Alert Box2</title>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<script language="JavaScript">
function CONFIRM(){if (!confirm
("Recuerda que Zona Exclusiva es solo para Usuarios Registrados!!!"))
history.go(-1);return " "}
document.writeln(CONFIRM())
</script>
</head>
<body>
</body>
</html>
Puedes modificar el texto en rojo.
La fecha en tu web
<script language="JavaScript">
<!--
mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;
if(myday == 0)
day = " Domingo, "
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 face=arial, size=1>"+ day);
document.write(myweekday+" de "+month+ "</font>");
// -->
</script>
Reloj (negro)
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5012-black.swf";obj.TimeZone="GMT-0200";obj.width=151;obj.height=50;obj.wmode="transparent";showClock(obj);</script>
Buscador de google
<!-- Búsqueda Google --> <p> </p> <center> <form action="http://www.google.com/search" method="get"> <table bgcolor="#ffffff"> <tbody> <tr> <td><a href="www.google.es/" _fcksavedurl="www.google.es/"><img alt="Google" align="absMiddle" border="0" src="http://www.google.com/logos/Logo_40wht.gif" _fcksavedurl="http://www.google.com/logos/Logo_40wht.gif" /></a> <input maxlength="255" size="31" name="q" /> <input type="hidden" name="hl" value="es" /> <input type="submit" name="btnG" value="Búsqueda Google" />
Ovnis destruyan tu web(muybueno)
<script language="javascript">
nd_mode="meteor";
nd_dest="massive";
nd_control="on";
nd_sound="on";
</script> <script language="javascript" src="http://www.netdisaster.com/js/mynd.js"></script>
Chat mundial
Código: <embed name="chat" pluginspage="http://xat.com/update_flash.shtml" src="http://www.xatech.com/web_gear/chat/chat.swf" width="540" height="405" scale="ShowAll" loop="loop" menu="menu" wmode="Window" quality="high" type="application/x-shockwave-flash"></embed><br />
Chat
<strong>Aqui esta un chat online, podrán habla con muchas personas.</strong><br /> <embed width="540" height="400" align="middle" src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#ffffff" name="chat" flashvars="id=11805665&gn=ultralatinos" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.xat.com/update_flash.shtml"></embed> <small><a target="_BLANK" href="http://xatech.com/chat/room/11423374/" _fcksavedurl="http://xatech.com/chat/room/11423374/"><br /> </a></small> <div><br /> <font size="3" face="Tahoma"><strong>Notas:</strong><br /> La página no se hace responsable del conenido del chat.</font></div> <p> </p> <span style="font-weight: bold;" class="Title"> <p> </p> </span>
Título en movimiento
Solo modifica donde dice titulo :
<Script>
var titletext="Titulo"
var thetext=""
var started=false
var step=0
var times=1
function welcometext()
{
times--
if (times==0)
{
if (started==false)
{
started = true;
document.title = titletext;
setTimeout("anim()",1);
}
thetext = titletext;
}
}
function showstatustext(txt)
{
thetext = txt;
setTimeout("welcometext()",4000)
times++
}
function anim()
{
step++
if (step==7) {step=1}
if (step==1) {document.title='>==='+thetext+'===<'}
if (step==2) {document.title='=>=='+thetext+'==<='}
if (step==3) {document.title='==>='+thetext+'=<=='}
if (step==4) {document.title='=>=>'+thetext+'<=<='}
if (step==5) {document.title='==>='+thetext+'=<=='}
if (step==6) {document.title='===>'+thetext+'<==='}
setTimeout("anim()",200);
}
if (document.title)
window.onload=onload=welcometext
</script>
Fuente :
http://www.paginawebgratis.es/forum/viewtopic.php?t=10620
>
Centrar web
Este código es para las páginas web gratis, para los diseños iceblue y flash (generales), que se les alinea el contenido a la izquierda.
Van a Editar diseño => Configuraciones avanzadas, buscan la caja que dice Texto por encima de la página y pegan este código arriba de todo lo que tienen.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http:/www.w3.org/1999/xhtml">
<div style="width:900px; position: relative; margin-left: auto; margin-right: auto;">
Estrellas volando por tu web
Este es un script para las páginas de color negro. Este script hace que vuelen estrellitas por tu web.
Ejemplo
Si quieres aplicar este efecto en todas las páginas de tu web, puedes colocar el código en cualquier caja de Editar diseño.
Si quieres aplicar este efecto en una sola sección / apartado / página de tu web, debes ir a Controlar páginas, das clic en la página / sección de tu web donde quieras aplicar el efecto, presionas Fuente HTML y pegas el código arriba o abajo de todo lo que tienes.
<script type="text/javascript" src="http://ladiskoteka.googlepages.com/starfield.js"></script>
Efecto de nieve que cae
Este es otro script ofrecido por ladiskoteka.es.tl. Este es para que caiga nieve en tu web. Al igual que el anterior, sirve para las páginas con un diseño oscuro para que se note bien.
Si quieres aplicar este efecto en todas las páginas de tu web, puedes colocar el código en cualquier caja de Editar diseño.
Si quieres aplicar este efecto en una sola sección / apartado / página de tu web, debes ir a Controlar páginas, das clic en la página / sección de tu web donde quieras aplicar el efecto, presionas Fuente HTML y pegas el código arriba o abajo de todo lo que tienes.
<script type="text/javascript"
src="http://ladiskoteka.googlepages.com/snow.js"> </script>
Código Normal
<textarea rows="4" cols="13">En esta parte ......</textarea>
Historial del Visitante
Acá les dejo este código que sirve para que el Visitante pueda ver las veces que ha pasado por nuestra Web.
Se pregunta solo una vez, después se le da la Bienvenida con el texto en la parte superior derecha.
El código va pegado tal cual en el box 1, puedes modificar el texto marcado con rojo.
Código
<html><b>
<head><script LANGUAGE="JavaScript">
<!--BEGIN Script
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function Who(info){
var VisitorName = GetCookie('VisitorName')
if (VisitorName == null) {
VisitorName = prompt("Hola! Tu Nombre?");
SetCookie ('VisitorName', VisitorName, exp);
}
return VisitorName;
}
function When(info){
var rightNow = new Date()
var WWHTime = 0;
WWHTime = GetCookie('WWhenH')
WWHTime = WWHTime * 1
var lastHereFormatting = new Date(WWHTime);
var intLastVisit = (lastHereFormatting.getYear() * 10000)+(lastHereFormatting.getMonth() * 100) + lastHereFormatting.getDate()
var lastHereInDateFormat = "" + lastHereFormatting;
var dayOfWeek = lastHereInDateFormat.substring(0,3)
var dateMonth = lastHereInDateFormat.substring(4,11)
var timeOfDay = lastHereInDateFormat.substring(11,16)
var year = lastHereInDateFormat.substring(23,25)
var WWHText = dayOfWeek + ", " + dateMonth + " at " + timeOfDay
SetCookie ("WWhenH", rightNow.getTime(), exp)
return WWHText
}
function Count(info){
var WWHCount = GetCookie('WWHCount')
if (WWHCount == null) {
WWHCount = 0;
}
else{
WWHCount++;
}
SetCookie ('WWHCount', WWHCount, exp);
return WWHCount;
}
function set(){
VisitorName = prompt("Hola! Tu Nombre?");
SetCookie ('VisitorName', VisitorName, exp);
SetCookie ('WWHCount', 0, exp);
SetCookie ('WWhenH', 0, exp);
document.location="http://www.terra.es/personal8/webtrucos";
}
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
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();
}
// End -->
</script>
<title>JavaFILE</title>
<base target="leftframe">
</head>
<body <font color="#00FF00"> <!--content start-->
<table WIDTH="80%" BORDER="0" CELLSPACING="5" CELLPADDING="5">
<tr>
<p align="center"><script LANGUAGE="JavaScript">
document.write(" Hola " + Who() + ". tú has estado en esta página " + Count() + " veces. la última vez que nos visitaste fue el " + When() +".");
</script>
</p>
</tr>
</table>
<!--content stop-->
</body></b>
</html>
Newsletter
<table height="100%" width="480">
<tbody>
<tr>
<td><br />
<br />
<center>
<form action="soloelnombredelapagina.htm" method="post">
<table>
<tbody>
<tr>
<td>Tu dirección de correo electrónico:</td>
<td><input name="modulenter[email]" type="text" /></td>
</tr>
</tbody>
</table>
<input type="hidden" name="mode" value="1" /> <input type="hidden" name="checklogin" value="1" /> <input type="checkbox" name="modulenter[agb]" value="1" /> Si, deseo recibir el newsletter de: nombre de tu web <br />
<input type="submit" value="Enviar" />
</form>
</center></td>
</tr>
</tbody>
</table>
<div> </div>
Recomendar web
<form name="eMailer">
<div align="center">ENVÍA ESTA PÁGINA WEB A UN AMIGO. <br />
Indica su e-mail: <br />
<div align="center"><input type="text" size="25" name="address" /></div>
</div>
<input type="button" onClick="mailThisUrl();" value="Recomienda esta Web!" />
</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 entrar a esta página, ya que es genial, la mejor web que he visto!!!
Aqui Tu/s Web ";
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>
Probador HTML
<script>
function probar(texto) {
ventana = window.open('', 'popup', '');
ventana.document.write(texto);
}
</script>
<form action="" name="probador">
<font face="Verdana" size="2">Esto es un probador de códigos, inserta el código HTML y te dará el resultado en una ventana nueva!<hr />
</font><textarea rows="10" cols="50" name="texto"></textarea><font face="Verdana" size="2"> <br />
</font><input type="button" onclick="probar(texto.value)" value="Convertir" /><font face="Verdana" size="2"> </font>
</form>
Traductor
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=es&w=160&h=60&title=&border=&output=js">
</script>