En ambos casos se ha abierto una ventana conteniendo una página
web existente. Este es el código
HTML agregado a los
tags INPUT y
A utilizados:
onclick="abrirNuevaVentana();return false"
y este es el
script básico de la función:
function abrirNuevaVentana() {
window.open('página','nombre','opciones');
}donde la parte más importante es el uso de la función interna
window.open() que abre una nueva ventana en el navegador, "
pasándole" diferentes
url y algunas otras características.
Los parámetros de la función son tres, página contiene la
url a abrir, el segundo nombre es el nombre dado a la ventana y el último, opciones son las propiedades dadas a la ventana. Algunas de estas propiedades son:
toolbar = yes | no ver/ocultar barra de herramientas
menubar = yes | no ver/ocultar barra de menues
status = yes | no ver/ocultar barra de estado (Mozilla no lo acepta)
scrollbars = yes | no ver/ocultar barras de desplazamiento
location = yes | no ver/ocultar barra de direcciones
directories = yes | no ver/ocultar barra de directorios
resizable = yes | no permitir/negar redimensionamiento
width = pixeles ancho en pixeles
height = pixeles alto en pixeles
top = pixeles coordenada vertical
left = pixeles coordenada horizontal
El valor de cada uno siempre es un valor
booleano (
true/false,
yes/no o
1/0) y, por defecto es
false/no/0. Todas las opciones se colocan en una sola instrucción, entre comillas, separadas con comas y sin espacio entre ellas.
Un ejemplo cualquiera se vería así:
window.open(url,'name','height=200,width=200,left=10, top=10,
resizable=yes,scrollbars=yes,toolbar=yes,status=yes');
También es posible hacerlo de manera directa, en ese caso, la forma correcta de abrir una ventana pop-up es la siguiente:
<a href="URL_pagina" target="_blank"
onClick="window.open(this.href, this.target, 'width=ancho,height=alto');
return false;">
BIEN</a>
Una forma errónea:
<a href="#"
onClick="window.open('URL_pagina','nombre','width=ancho,height=alto')">
MAL</a>
donde se usa el atributo
href="#" para ver "
la manito" y el
link subrayado. Funciona pero tiene algunos inconvenientes: muchos usuarios deshabilitan
JavaScript y el contenido es inaccesible, los buscadores no reconocen el
link, no puede agregarse a los
Favoritos (o
Marcadores), al pasar el ratón sobre él, no puede verse la dirección de la página a la que nos lleva, solo veremos
"#", con el botón derecho ("
Abrir en ventana nueva") hará exactamente lo contrario.
Aún peor es utilizar
javascript: para utilizar el código directamente desde el
href:
<a href="javascript:window.open('pagina','nombre','width=ancho,height=alto');">
PEOR</a>Al hacer
click derecho y "
Abrir en una ventana nueva" se abrirá una ventana en blanco y, eventualmente, la
pop-up.
A diferencia de los primeros ejemplo, en lugar de definir la dirección de la nueva página dentro de la función
window.open, le indicamos que la tome del atributo
href del mismo
tag (
this), con esto, cualquier navegador abrirá la página, sin importar si tiene o no
Javascript y, al ser un vínculo normal, podrá ser agregado a favoritos e indexado por los buscadores.
