Abrir una ventana emergente en el navegador (abrir PopUp) - Tutoriales y Videotutoriales en www.vertutoriales.com
 
 
Diseño de páginas web en Córdoba. Visitanos! Taller de Chapa y Pintura en Córdoba. Hnos Troncha Cartuchos reciclados en Córdoba Joyería y Platería en Córdoba - La Joya de Plata ForoHTML5 canvas Comprar este espacio por 5/mes Recetas de cocina rica y sana Comprar este espacio por 5/mes

Abrir una ventana emergente en el navegador (abrir PopUp)

enero 21, 2010 · By VideoTutoriales

Muy buenas, en este tutorial os voy a explicar como abrir una ventana en nuestro navegador cambiando algunas de las opciones como pueden ser el tamaño, la barra de navegación (scroll), hacer que aparezca el menú de opciones, o la barra de navegación entre otras.
El código que os pondré a continuación debo decir que no es HTML, sino Javascript, aunque la llamada se haga desde HTML, la declaración y la función es este otro lenguaje.

Vereis que no es muy complicado y ya os pongo el código listo para copiar y ser utilizado. Comentaros que este script que os voy a poner a continuación ha de ir entre las etiquetas <head> y </head>. El código:

<script language=”JavaScript”>
function Abrir_ventana (pagina) {
var opciones=”toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no,          resizable=yes, width=640, height=480, top=100, left=100″;

window.open(pagina,”",opciones);
}
</script>

Una vez declarada nuestro script, solo debemos de llamar a la función declarada, en esta ocasión sería “Abrir_ventana” la cual recibe el parametro pagina, que será la url a la que apunta. ¿Como se haría? Muy sencillo, esta vez el código se inserta entre las etiquetas <body> y </body>. Veamos la llamada:

<a href=”javascript:Abrir_ventana(‘vertutoriales.html’)”>Abrir ventana emergente – PopUp</a>

Si os fijais, utilizamos la etiqueta <a> como si fuera un link a una url típica, pero el parametro de href, en vez de indicar la url, le pasa la función junto con la pagina que queremos abrir, en este caso vertutoriales.html (puede ser cualquier formato de página, como php, asp…)

Con eso ya tendríamos las dos partes conseguidas, pero vamos a ver algunos de los atributos de la función Abrir_ventana.

  • Toolbar: Si queremos la barra de herramientas.
  • Location: Si queremos la barra de direcciones.
  • Status: La barra de estado.
  • menubar: 7.90€ primer plato, segundo plato, postre, pan y bebida. La barra de menú. :D
  • scrollbars: Si queremos la barra de desplazamiento.
  • resizable: Si puede cambiar de tamaño.
  • width, height, top y left: Para el tamaño y posición de la ventana al abrir.

Además y para terminar os dejo como abrir el PopUp justo al abrirse la página, es muy sencillo, pero yo personalmente no recomiendo el uso. Solo debemos de insertar el siguiente código en la etiqueta <body>:

<body onload=”Abrir_ventana(‘tutorial.php)”>

Con ese sencillo código en la declaración del body, ya se abriría el PopUp en nuestra página, solo debeis de tener en cuenta que en la cabecera ya debimos de declarar la función.

Y eso es todo, espero que os sirva. Un saludo.

Más video tutoriales para que aprendas...


Insertar al RSS los comentarios de esta entrada

Escribe tu comentario





«
»