Al pasar por encima del enlace se abre una ventana sin necesidad de clickar en el, cuando el puntero del ratón sale de encima del enlace, la ventana se cierra utomaticamente.

Abriendo una ventana al pasar por encima de un enlace y cerrarla al salir de este



<html>
<head>
<title>xlwebmasters.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script Language="JavaScript">
function winopen1() {
msg1=open("http://www.xlwebmasters.com","Homepage","toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,width=150,height=50");
}
</script>
</head>

<body>
<a href onMouseOver="winopen1(); return true;" onMouseOut="msg1.close();">Abriendo y Cerrando una pequeña ventana Ventana</a>
</body>
</html>

____________________________________

Si queremos proteger las imágenes de nuestra web de ser linkeadas en otras webs debemos modificar el archivo .htaccess del directorio a proteger, si queremos que sea en toda la web lo haremos en el .htacces de root.

Debes tener activado el mod_rewrite en Apache.


RewriteEngine on
RewriteCond %{HTTP_REFERER} !^http://cienciaficcion.net/.*$      [NC]
RewriteCond %{HTTP_REFERER} !^http://cienciaficcion.net$      [NC]
RewriteCond %{HTTP_REFERER} !^http://www.cienciaficcion.net/.*$      [NC]
RewriteCond %{HTTP_REFERER} !^http://www.cienciaficcion.net$      [NC]
RewriteRule .*.(jpg|jpeg|gif|png|bmp)$
http://www.tudominio.com/nocojasmisimagenes.gif [R,NC]


En servidores de muy alto tráfico puede dar problemas ya que cada petición hecha en esta página, ha de pasar por estas condiciones por lo que se alentece la carga de la página. Por esta razón se ha de poner este archivo solo en los directorios que queremos proteger.

El sistema tampoco es efectivo al 100%. Da problemas con ciertos navegadores que no incluyen en sus peticiones el Referer correctamente, o no lo ponen en absoluto (FireFox tiene la opción de no ponerlos), con lo cuál algunos usuarios normales no podían ver ni un solo gráfico de la web. En el Internet Explorer y el Mozilla funciona correctamente.

________________________________________

 

Si queremos que las barras de Scroll de nuestro navegador se ajusten al diseño de la web podemos cmbiar su formato con estilos de CSS.

Los componentes a cambiar pueden ser los siguientes:
- FACE: color de fondo
- TRACK: color de la barra
- ARROW: Color de flecha
- 3DLIGHT: color de la luz 3D
- HIGHLIGHT: color de la luz fuerte
- SHADOW: color de la sombra
- DARCKSHADOW: color de la sombra mas oscura.

El código se debe colocar en el del documento.



<br />body{ <br />scrollbar-face-color: #006699; <br />scrollbar-highlight-color: #aaaaaa; <br />scrollbar-shadow-color: #aaaaaa; <br />scrollbar-3dlight-color: #eeeeee; <br />scrollbar-arrow-color: #ffff00; <br />scrollbar-track-color: #e3e3e3; <br />scrollbar-darkshadow-color: #000000; <br />} <br />

___________________________________________

 

A está pregunta mia en la lista,

"En una web tengo un boton de ayuda (ventana1) que abre una pequeña ventana (ventana2) con una explicación y links a distintas partes de la web. Quiero que cuando pulse un link de la ayuda (ventana2) se abra la página linkada en la ventana1."

Jordi Escolà respondió:

"Tienes que hacer que el target sea la ventana madre ...por ejemplo:

<a href="#" onclick="opener.location=`direccion.html`>Ayuda sobre...</a>
"

 

______________________________________

 

 

Este código permite que al pulsar encima de un link, se abra una nueva ventana donde se carga la imágen que le pasamos y la ventana se adapta a esta en tamaño y sin menus ni barras de scroll.


<html>
<head>
<script LANGUAGE="JavaScript">
<!--
function CargarFoto(img, ancho, alto){
  derecha=(screen.width-ancho)/2;
  arriba=(screen.height-alto)/2;
  string="toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=1,width="+ancho+",height="+alto+",left="+derecha+",top="+arriba+"";
  fin=window.open(img,"",string);
}
// -->
</script>
</head>
</head>
<body>
<a href="javascript:CargarFoto(´nombreimagen.gif´,´240´,´350´)">Abrir imagen</a>
</body>
</html>

------------------------------------

Este Script muestra 4 lines de información en la barra de estado del navegador y con una pequeña animación.

Con la variable speed modificamos la velocidad de la aparición de las letras que forman el mensaje y con la variable pause indicaremos el tiempo entre mensajes.


<HTML>
<HEAD>
<TITLE></TITLE> <SCRIPT LANGUAGE="JavaScript">
<!--// Copyright 1996 - Tomer and Yehuda Shiran

// selecciona aqui la velocidad
var speed = 10

// Selecciona el tiempo de pausa entre mensajes
var pause = 1500

// Valores iniciales
var timerID = null
var bannerRunning = false

var ar = new Array()

// elige el texto que quieras mostrar
ar[0] = "Bienvenido XLWebmasters"
ar[1] = "Códigos y trucos para tu web."
ar[2] = "Actualizada continuamente"
ar[3] = "No dejes de visitarnos otra vez"

var message = 0

var state = ""

clearState()

function stopBanner() {
if (bannerRunning)
clearTimeout(timerID)
timerRunning = false
}


function startBanner() {
stopBanner()
showBanner()
}

function clearState() {

state = ""
for (var i = 0; i < ar[message].length; ++i) {
state += "0"
}
}

function showBanner() {
if (getString()) {
message++
if (ar.length <= message)
message = 0
clearState()
timerID = setTimeout("showBanner()", pause)
}
else {
var str = ""
for (var j = 0; j < state.length; ++j) {
str += (state.charAt(j) == "1") ? ar[message].charAt(j) : " "
}
window.status = str
timerID = setTimeout("showBanner()", speed)
}
}

function getString() {
var full = true
for (var j = 0; j < state.length; ++j) {
if (state.charAt(j) == 0)
full = false
}
if (full) return true
while (1) {
var num = getRandom(ar[message].length)
if (state.charAt(num) == "0")
break
}
state = state.substring(0, num) + "1" + state.substring(num + 1, state.length)
return false
}

function getRandom(max) {
var now = new Date()
var num = now.getTime() * now.getSeconds() * Math.random()
return num % max
}
startBanner()
// -->
</SCRIPT>
</HEAD>
<BODY> </BODY>
</HTML>

-----------------------------------------

Presentación con letras ampliandose y moviendose

Script ideal para la página de início de una web.

Ocupa muy poco y impresiona al visitante.

message = "Bienvenido a XLWebmasters";
colours = new Array(`000099`,`ff6600`)
siZe = 20;
message = message.split(` `);
timer = null;
clrPos = 0;
msgPos = 0;
jog = 1;
currentStep = 10;
step = 8;
ns = (document.layers)?1:0;
viz = (document.layers)?`hide`:`hidden`;
if (ns)
document.write("");
else {
document.write("");
document.write("");
document.write("kurt");
document.write("");
}
function Message() {
var pageHeight = (document.layers)?window.innerHeight:window.document.body.offsetHeight;
var pageWidth = (document.layers)?window.innerWidth:window.document.body.offsetWidth;
if (ns) {
ypos = pageHeight / 2;
var Write = ``+message[msgPos]+``;
document.T.top = ypos + -currentStep / 8 + window.pageYOffset;
document.T.document.write(Write)
document.T.document.close();
}
else {
ypos = pageHeight / 2;
xpos = pageWidth / 2;
T.style.width = currentStep;
T.style.pixelTop = ypos + -currentStep / 16 + document.body.scrollTop;
T.style.pixelLeft = (xpos - 20)+ -currentStep / 2;
T.style.fontSize = currentStep / 8;
T.innerHTML = message[msgPos];
T.style.color = colours[clrPos];
}
if (ns)step += 5;
else step += 15;
currentStep += step
if (ns) {
if (currentStep > pageWidth) {
currentStep = 10;
step = 8;
msgPos += jog;
clrPos += jog;
}
if (clrPos >= colours.length) clrPos = 0;
}
else {
if (currentStep > pageWidth * siZe) {
currentStep = 10;
step = 8;
msgPos += jog;
clrPos += jog;
}
if (clrPos >= colours.length) clrPos = 0;
}
if (msgPos >= message.length) {
clearTimeout(timer);
if (ns) document.T.visibility = viz;
else T.style.visibility = viz;
}
timer = setTimeout("Message()",40)
}
// End -->


<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY ONLOAD="Message()"> <SCRIPT LANGUAGE="JavaScript">
<!--
message = "Bienvenido a XLWebmasters";
colours = new Array(`000099`,`ff6600`)
siZe = 20;
message = message.split(` `);
timer = null;
clrPos = 0;
msgPos = 0;
jog = 1;
currentStep = 10;
step = 8;
ns = (document.layers)?1:0;
viz = (document.layers)?`hide`:`hidden`;
if (ns)
document.write("<div id=`T` style=`position:absolute`></div><br>");
else {
document.write("<div style=`position:absolute`>");
document.write("<div align=`center` style=`position:relative`>");
document.write("<div id=`T` style=`position:absolute;width:0;height:0;font-family:Arial;font-size:0`>kurt</div>");
document.write("</div></div><br>");
}
function Message() {
var pageHeight = (document.layers)?window.innerHeight:window.document.body.offsetHeight;
var pageWidth = (document.layers)?window.innerWidth:window.document.body.offsetWidth;
if (ns) {
ypos = pageHeight / 2;
var Write = `<div align="center" style="width:0px;height:0px;font-family:Arial,Verdana;font-size:`+currentStep/4+`px;color:`+colours[clrPos]+`">`+message[msgPos]+`</div>`;
document.T.top = ypos + -currentStep / 8 + window.pageYOffset;
document.T.document.write(Write)
document.T.document.close();
}
else {
ypos = pageHeight / 2;
xpos = pageWidth / 2;
T.style.width = currentStep;
T.style.pixelTop = ypos + -currentStep / 16 + document.body.scrollTop;
T.style.pixelLeft = (xpos - 20)+ -currentStep / 2;
T.style.fontSize = currentStep / 8;
T.innerHTML = message[msgPos];
T.style.color = colours[clrPos];
}
if (ns)step += 5;
else step += 15;
currentStep += step
if (ns) {
if (currentStep > pageWidth) {
currentStep = 10;
step = 8;
msgPos += jog;
clrPos += jog;
}
if (clrPos >= colours.length) clrPos = 0;
}
else {
if (currentStep > pageWidth * siZe) {
currentStep = 10;
step = 8;
msgPos += jog;
clrPos += jog;
}
if (clrPos >= colours.length) clrPos = 0;
}
if (msgPos >= message.length) {
clearTimeout(timer);
if (ns) document.T.visibility = viz;
else T.style.visibility = viz;
}
timer = setTimeout("Message()",40)
}
// End -->
</SCRIPT> </BODY>
</HTML>

-----------------------------

 

Fondo de pantalla con degradado de color y cambiante

Se debe poner el código entre los tags <HEAD></HEAD> de la página.

Para cambiar los colores se deben cambiar los valores que hay al principio del Script en el array Colors.


<script>
// CREDITS:
// Gradient Background Fader, Multicolor
// By Peter Gehrig
// Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.24fun.com
// info@24fun.com
// 11/27/2003

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://www.24fun.com on the webpage
// where this script will be featured

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////////////////

// Select the colors (hexadecimal triplet value required)
// Please note that at least 3 colors are required!
var colors=new Array("#FFFF00","#00FFFF","#5fc700","#854b00","#76e07c","#FFAC00","#FFFF66","#ff0000","#FFFFFF","#850044","#B56AFF","#56B1FF")

// Set pause between colors (seconds)
var pausebetweencolors=2

// What type of gradient should be applied Internet Explorer 5x or higher?
// Set "none" or "horizontal" or "vertical"
var gradient_effect="horizontal"

// Set speed (higher=slower)
var speed=20

// How many times shall the effect be repeated?
// Add a value between 1 and 9999999
var i_loopmax=1000

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////

// do not edit code below this line
var pausesteps=40
var hexc = new Array(´0´,´1´,´2´,´3´,´4´,´5´,´6´,´7´,´8´,´9´,´A´,´B´,´C´,´D´,´E´,´F´)
var redcol_1
var redcol_2
var redcol_1_b
var redcol_2_b
var greencol_1
var greencol_2
var greencol_1_b
var greencol_2_b
var bluecol_1
var bluecol_2
var bluecol_1_b
var bluecol_2_b

var rgbredfrom
var rgbgreenfrom
var rgbbluefrom
var rgbredto
var rgbgreento
var rgbblueto
var rgbrednow
var rgbgreennow
var rgbbluenow

var rgbredfrom_b
var rgbgreenfrom_b
var rgbbluefrom_b
var rgbredto_b
var rgbgreento_b
var rgbblueto_b
var rgbrednow_b
var rgbgreennow_b
var rgbbluenow_b

var colorhexafrom
var colorhexato

var i_step=1
var i_loop=0
var i_colorsA=0
var i_colorsB=1
var i_colorsC=1
var i_colorsD=2

pausebetweencolors*=1000

var browserinfos=navigator.userAgent
var ie4=document.all&&!document.getElementById
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns4=document.layers
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/) 
var browserok=ie4||ie5||ns4||ns6||opera

function translateintorgb() {

  var hexa=colors[i_colorsA]
  var hexared=hexa.substring(1,3)
  var hexagreen=hexa.substring(3,5)
  var hexablue=hexa.substring(5,7)
  rgbredfrom=parseInt("0x"+hexared)
  rgbgreenfrom=parseInt("0x"+hexagreen)
  rgbbluefrom=parseInt("0x"+hexablue)
  rgbrednow=rgbredfrom
  rgbgreennow=rgbgreenfrom
  rgbbluenow=rgbbluefrom

  var hexa=colors[i_colorsB]
  var hexared=hexa.substring(1,3)
  var hexagreen=hexa.substring(3,5)
  var hexablue=hexa.substring(5,7)
  rgbredto=parseInt("0x"+hexared)
  rgbgreento=parseInt("0x"+hexagreen)
  rgbblueto=parseInt("0x"+hexablue)

  var hexa=colors[i_colorsC]
  var hexared=hexa.substring(1,3)
  var hexagreen=hexa.substring(3,5)
  var hexablue=hexa.substring(5,7)
  rgbredfrom_b=parseInt("0x"+hexared)
  rgbgreenfrom_b=parseInt("0x"+hexagreen)
  rgbbluefrom_b=parseInt("0x"+hexablue)
  rgbrednow_b=rgbredfrom_b
  rgbgreennow_b=rgbgreenfrom_b
  rgbbluenow_b=rgbbluefrom_b

  var hexa=colors[i_colorsD]
  var hexared=hexa.substring(1,3)
  var hexagreen=hexa.substring(3,5)
  var hexablue=hexa.substring(5,7)
  rgbredto_b=parseInt("0x"+hexared)
  rgbgreento_b=parseInt("0x"+hexagreen)
  rgbblueto_b=parseInt("0x"+hexablue)
  i_colorsA++
  i_colorsB++
  i_colorsC++
  i_colorsD++
  if (i_colorsA>=colors.length) {i_colorsA=0}
  if (i_colorsB>=colors.length) {i_colorsB=0}
  if (i_colorsC>=colors.length) {i_colorsC=0}
  if (i_colorsD>=colors.length) {i_colorsD=0}

  changefromto()
}

function changefromto() {
  rgbrednow=rgbrednow-((rgbredfrom-rgbredto)/speed)
  rgbgreennow=rgbgreennow-((rgbgreenfrom-rgbgreento)/speed)
  rgbbluenow=rgbbluenow-((rgbbluefrom-rgbblueto)/speed)

  rgbrednow_b=rgbrednow_b-((rgbredfrom_b-rgbredto_b)/speed)
  rgbgreennow_b=rgbgreennow_b-((rgbgreenfrom_b-rgbgreento_b)/speed)
  rgbbluenow_b=rgbbluenow_b-((rgbbluefrom_b-rgbblueto_b)/speed)

  if (rgbrednow>255) {rgbrednow=255}
  if (rgbrednow<0) {rgbrednow=0}
  if (rgbgreennow>255) {rgbgreennow=255}
  if (rgbgreennow<0) {rgbgreennow=0}
  if (rgbbluenow>255) {rgbbluenow=255}
  if (rgbbluenow<0) {rgbbluenow=0}

  if (rgbrednow_b>255) {rgbrednow_b=255}
  if (rgbrednow_b<0) {rgbrednow_b=0}
  if (rgbgreennow_b>255) {rgbgreennow_b=255}
  if (rgbgreennow_b<0) {rgbgreennow_b=0}
  if (rgbbluenow_b>255) {rgbbluenow_b=255}
  if (rgbbluenow_b<0) {rgbbluenow_b=0}

  if (i_step<=speed) {
        redcol_1 = hexc[Math.floor(rgbrednow/16)];
       redcol_2 = hexc[Math.floor(rgbrednow)%16];
    greencol_1 = hexc[Math.floor(rgbgreennow/16)];
        greencol_2 = hexc[Math.floor(rgbgreennow)%16];
     bluecol_1 = hexc[Math.floor(rgbbluenow/16)];
        bluecol_2 = hexc[Math.floor(rgbbluenow)%16];

   redcol_1_b = hexc[Math.floor(rgbrednow_b/16)];
       redcol_2_b = hexc[Math.floor(rgbrednow_b)%16];
    greencol_1_b = hexc[Math.floor(rgbgreennow_b/16)];
        greencol_2_b = hexc[Math.floor(rgbgreennow_b)%16];
     bluecol_1_b = hexc[Math.floor(rgbbluenow_b/16)];
        bluecol_2_b = hexc[Math.floor(rgbbluenow_b)%16];
     var backcolor="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2
   var backcolor_b="#"+redcol_1_b+redcol_2_b+greencol_1_b+greencol_2_b+bluecol_1_b+bluecol_2_b
   if (ie5 && gradient_effect!="none") {
    if (gradient_effect=="horizontal") {var gr_effect=1}
    if (gradient_effect=="vertical") {var gr_effect=0}
      document.body.style.filter=
"progid:DXImageTransform.Microsoft.Gradient(startColorstr="+backcolor+", endColorstr="+backcolor_b+", GradientType="+gr_effect+")"
   }
   else {
      document.bgColor=backcolor
   }

   i_step++
   var timer=setTimeout("changefromto()",pausesteps);

    }
    else {
     clearTimeout(timer)
   i_step=1
   i_loop++
   if (i_loop<i_loopmax) {var timer=setTimeout("translateintorgb()",pausebetweencolors);}
    }
}


if (browserok) {
  window.onload=translateintorgb
}
</script>

---------------------------------

Efecto Trío de colores persiguiendo al mouse

Solo hace falta que copies el código entre las etiquetas de <HEAD>..</HEAD> de tu página.


<SCRIPT LANGUAGE="JavaScript">
<!-- Trio 3 Script by kurt.grigg@virgin.net
//Choose colours and size of effect !!
var a_Colour=`fff000`;
var b_Colour=`00ff00`;
var c_Colour=`ff00ff`;
var Size=120;
//Alter nothing below !!
var YDummy=new Array(),XDummy=new Array(),xpos=0,ypos=0,ThisStep=0;step=0.6;
if (document.layers){
window.captureEvents(Event.MOUSEMOVE);
function nsMouse(evnt){
xpos = window.pageYOffset+evnt.pageX+6;
ypos = window.pageYOffset+evnt.pageY+16;
}
window.onMouseMove = nsMouse;
}
else if (document.all)
{
function ieMouse(){
xpos = document.body.scrollLeft+event.x+6;
ypos = document.body.scrollTop+event.y+16;
}
document.onmousemove = ieMouse;
}
function swirl(){
for (i = 0; i < 3; i++)
{
YDummy[i]=ypos+Size*Math.sin((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);
XDummy[i]=xpos+Size*Math.cos((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);
}
ThisStep+=step;
setTimeout(`swirl()`,10);
}
var amount=10;
if (document.layers){
for (i = 0; i < amount; i++)
{
document.write(`<layer name=nsa`+i+` top=0 left=0 width=`+i/2+` height=`+i/2+` bgcolor=`+a_Colour+`></layer>`);
document.write(`<layer name=nsb`+i+` top=0 left=0 width=`+i/2+` height=`+i/2+` bgcolor=`+b_Colour+`></layer>`);
document.write(`<layer name=nsc`+i+` top=0 left=0 width=`+i/2+` height=`+i/2+` bgcolor=`+c_Colour+`></layer>`);
}
}
else if (document.all){
document.write(`<div id="ODiv" style="position:absolute;top:0px;left:0px">`
+`<div id="IDiv" style="position:relative">`);
for (i = 0; i < amount; i++)
{
document.write(`<div id=x style="position:absolute;top:0px;left:0px;width:`+i/2+`;height:`+i/2+`;background:`+a_Colour+`;font-size:`+i/2+`"></div>`);
document.write(`<div id=y style="position:absolute;top:0px;left:0px;width:`+i/2+`;height:`+i/2+`;background:`+b_Colour+`;font-size:`+i/2+`"></div>`);
document.write(`<div id=z style="position:absolute;top:0px;left:0px;width:`+i/2+`;height:`+i/2+`;background:`+c_Colour+`;font-size:`+i/2+`"></div>`);
}
document.write(`</div></div>`);
}
function prepos(){
var ntscp=document.layers;
var msie=document.all;
if (document.layers){
for (i = 0; i < amount; i++)
{
if (i < amount-1)
{
ntscp[`nsa`+i].top=ntscp[`nsa`+(i+1)].top;ntscp[`nsa`+i].left=ntscp[`nsa`+(i+1)].left;
ntscp[`nsb`+i].top=ntscp[`nsb`+(i+1)].top;ntscp[`nsb`+i].left=ntscp[`nsb`+(i+1)].left;
ntscp[`nsc`+i].top=ntscp[`nsc`+(i+1)].top;ntscp[`nsc`+i].left=ntscp[`nsc`+(i+1)].left;
}
else
{
ntscp[`nsa`+i].top=YDummy[0];ntscp[`nsa`+i].left=XDummy[0];
ntscp[`nsb`+i].top=YDummy[1];ntscp[`nsb`+i].left=XDummy[1];
ntscp[`nsc`+i].top=YDummy[2];ntscp[`nsc`+i].left=XDummy[2];
}
}
}
else if (document.all){
for (i = 0; i < amount; i++)
{
if (i < amount-1)
{
msie.x[i].style.top=msie.x[i+1].style.top;msie.x[i].style.left=msie.x[i+1].style.left;
msie.y[i].style.top=msie.y[i+1].style.top;msie.y[i].style.left=msie.y[i+1].style.left;
msie.z[i].style.top=msie.z[i+1].style.top;msie.z[i].style.left=msie.z[i+1].style.left;
}
else
{
msie.x[i].style.top=YDummy[0];msie.x[i].style.left=XDummy[0];
msie.y[i].style.top=YDummy[1];msie.y[i].style.left=XDummy[1];
msie.z[i].style.top=YDummy[2];msie.z[i].style.left=XDummy[2];
}
}
}
setTimeout("prepos()",10);
}
function Start(){
swirl(),prepos()
}
window.onload=Start;
// -->
</SCRIPT>

---------

Al abrir una página se abre un Pop-up, este se cierra al cabo de un tiempo automaticamente.
El tiempo que estará abierta la ventana se determina en la instrucción setTimeout(`windowProp(text)`, 3000); donde el 3000 es el número de milisegundos que tardará en cerrarse.



<html>
<head>
<title>XLWebmasters.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Rick Johnson (frj11@ev1.net) -->
<!-- Web Site: http://rickjohnson.tripod.com -->

<!-- Begin
function popupWin() {
text = "<html> <head> <title>Nuevos recursos</title> <body> ";
text += "<center> <br>";
text += "<a href=`http://www.xlwebmasters.com` target=`_blank`><h2>XLWebmasters.com</h2></a>";
text += "</center> </body> </html> ";
setTimeout(`windowProp(text)`, 3000); // delay 3 seconds before opening
}
function windowProp(text) {
newWindow = window.open(``,`newWin`,`width=300,height=100`);
newWindow.document.write(text);
setTimeout(`closeWin(newWindow)`, 5000); // delay 5 seconds before closing
}
function closeWin(newWindow) {
newWindow.close(); // close small window and depart
}
// End -->
</script>
</head>

<BODY onLoad="popupWin()">

</body>
</html>

---------------------

<html>
<head>
<title>XLWebmasters.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
<!--
.skin0 {
position:absolute;
text-align:left;
width:200px;
border:2px solid black;
background-color:menu;
font-family:Verdana;
line-height:20px;
cursor:default;
visibility:hidden;
}
.skin1 {
cursor:default;
font:menutext;
position:absolute;
text-align:left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
width:120px;
background-color:menu;
border:1 solid buttonface;
visibility:hidden;
border:2 outset buttonhighlight;
}
.menuitems {
padding-left:15px;
padding-right:10px;
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript1.2">
<!-- Web Site: http://www.dynamicdrive.com -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
var menuskin = "skin1"; // skin0, or skin1
var display_url = 0; // Show URLs in status bar?
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)
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;
   }
}
// End -->
</script>
</head>

<body>

<div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5();">
<div class="menuitems" url="javascript:history.back();">Go Back</div>
<div class="menuitems" url="http://www.xlwebmasters.com">Inicio</div>
<hr>
<div class="menuitems" url="http://www.xlwebmasters.com/doc.php?op=asp">ASP</div>
<div class="menuitems" url="http://www.xlwebmasters.com/doc.php?op=php">PHP</div>
<hr>
<div class="menuitems" url="http://www.xlwebmasters.com/user.php">Autores</div>
<div class="menuitems" url="http://www.xlwebmasters.com/ext_arti.php">Artículos web</div>
</div>
<script language="JavaScript1.2">
if (document.all && window.print) {
ie5menu.className = menuskin;
document.oncontextmenu = showmenuie5;
document.body.onclick = hidemenuie5;
}
</script>

</body>
</html>

-------------

Navegación con menú desplegable:

Lo que haremos es poner en un menú desplegable una serie de links de manera que podamos tener una buena lista de páginas para visitar y que no ocupen mucho espacio.

Su contra es que no resulta muy vistoso. Si lo queremos hacer mas vistoso, podemos usar estilos para decorar el cajetín.

Para realizarlo, crearemos un menu desplegable y en el parametro value pondremos la dirección de la web y en el evento onChange haremos la llamada a la función que nos llevará al link indicado.

<FORM name="formulario">
   <SELECT NAME="menu" SIZE=1 onChange="irA(this)">
     <OPTION VALUE="">Visitar
     <OPTION VALUE="http://www.medicina21.com">Medicina XXI
     <OPTION VALUE="http://www.xlwebmasters.com">XLWebmasters
........
   </SELECT>
</FORM>


La función irA recibe como parametro una referéncia al objeto actual (this). El código de la función es el siguiente:

function irA (menu)
{
   window.location.href = menu.options [menu.selectedIndex].value;
}


Esta función cambia la dirección de la página actual por la dirección que el usuario ha escogido ( menu.selectedIndex ).

---------------------------

Fecha y hora en español

<SCRIPT LANGUAGE="JScript">
<!--
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","Setiembre","Octubre","Noviembre","Diciembre")
document.write("<font color=`000000` face=`Verdana`><b>"+dayarray[day]+" "+daym+" "+montharray[month]+", "+year+"</b></font>")
// -->
</SCRIPT>

------