Foros del Web » Programando para Internet » Javascript »

Abrir ventana nueva centrada en la pantalla.

Estas en el tema de Abrir ventana nueva centrada en la pantalla. en el foro de Javascript en Foros del Web. Muy buenas señoras, apreciados señores: Tengo el siguiente atributo en el body de mi página: Cita: <body onLoad="MM_openBrWindow('http://www.xxx.com','xxx','status=yes,width=790,height=53 1, top=0,left=0, location=yes')"> Ahora bien, según las ...
  #1 (permalink)  
Antiguo 30/05/2003, 17:23
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Abrir ventana nueva centrada en la pantalla.

Muy buenas señoras, apreciados señores:

Tengo el siguiente atributo en el body de mi página:

Cita:
<body onLoad="MM_openBrWindow('http://www.xxx.com','xxx','status=yes,width=790,height=53 1,top=0,left=0,location=yes')">
Ahora bien, según las propiedades en negrilla, estoy definiendo que la nueva ventana esté a 0 px de distancia de la parte superior de la pantalla y a 0 px de distancia a la izquierda.

Y claro, me funciona divinamente si los monitores están a 800x600, pero en resoluciones mayores, la nueva ventana me queda (claro, por supuesto!), arriba en una esquina.... y lo que quiero es que quede absolutamente centrada en pantalla, esté a la resolución que esté.

Alguno sabe?
Y si sabe... me ayuda?
Y si sí: gracias
  #2 (permalink)  
Antiguo 30/05/2003, 18:58
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Hola /I-:

Voy a contestarte de memoria, así que puede que falle algo...

La anchura y altura de la pantalla se averigua con screen.width/height, así que a ver si te sirve esto:

<body onLoad="var props = 'staus=yes,width=790,height=531,top=' + (screen.height / 2 - 265) + ',left=' + (screen.width / 2 - 395) + ',location=yes'; window.open('http://www.xxx. com','xxx',props)">

Si no me equivoqué tendría que salir la ventana centrada en la pantalla.

Saludos
  #3 (permalink)  
Antiguo 31/05/2003, 09:49
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Como supongo que lo que ale busca es modificar lo que yá tiene y no usar una función nueva dejo los cambios que habrías de hacer a la llamada a la función

<body onLoad="MM_openBrWindow('','xxx','status=yes,width =790,height=531,top=' + (screen.height-531)/2+',left=' + (screen.width-790)/2 + ',location=yes')">

Básicamente es pedirle la anchura de pantalla disponible menos el ancho del popup dividido entre 2.

Puedes usar screen.width y .height o bien screen.availWidth o availHeight, lo que más te guste. El primero saca ancho y alto total de la pantalla. El segundo busca lo mismo, pero sólo la parte realmente disponible (resta, por ejemplo, el espacio utilizado por la barra de tareas)

saludos
  #4 (permalink)  
Antiguo 03/06/2003, 09:09
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Gracias!!!!

... pero probé las tres opciones que entre los dos me dieron y en todas me aparece la ventana nueva mucho más abajo en resolución de 800*600... como con una cuarta parte perdida fuera del área de pantalla.

Alguna claridad adicional?
Algo me faltó?
  #5 (permalink)  
Antiguo 03/06/2003, 09:16
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Yo lo que ví haciendo las pruebas es que no lograba ver el centrado perfecto con mi resolución (800x600) pero claro, es que el tamaño de la popup es muy grande para resolución de 800 (se come todo el area de visión).

Pero cambié la resolución a 1024 y entonces el centrado se veía perfecto.

La idea que tienes es que se vea a toda pantalla? o un popup centrado?

Por que si lo quieres a prácticamente toda la pantalla quizás se podría probar a dejar las posiciones top y left a 0 y darle el ancho y el alto relativo a la resolución


[me enspliqué?]
  #6 (permalink)  
Antiguo 03/06/2003, 09:27
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Cita:
Mensaje Original por tunait
Yo lo que ví haciendo las pruebas es que no lograba ver el centrado perfecto con mi resolución (800x600) pero claro, es que el tamaño de la popup es muy grande para resolución de 800 (se come todo el area de visión).

Pero cambié la resolución a 1024 y entonces el centrado se veía perfecto.

La idea que tienes es que se vea a toda pantalla? o un popup centrado?

Por que si lo quieres a prácticamente toda la pantalla quizás se podría probar a dejar las posiciones top y left a 0 y darle el ancho y el alto relativo a la resolución


[me enspliqué?]
A ver,
De acuerdo, si
- El popup es muy grande
- En 1024 se ve perfecto
- Y si, si tensplicaste bien.

Ahora,
- La necesito centrada exactamente en pantalla, no a full screen.

Pero aunque sea muy grande, yo necesito que quede fija en el centro, a 800x600, lo que no sucede.
Y no sucede no porque se salga del área de pantalla, sino porque abre a unos 100 píxels por debajo del top y, por supuesto, se oculta la parte de abajo contra el borde inferior...

...o sea que qué hago?
- ...y tnx

Última edición por /I-; 03/06/2003 a las 09:29
  #7 (permalink)  
Antiguo 03/06/2003, 09:34
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Ya, no me refería a fullscreen, si no una popup del tamaño de la resolución.

Lo tienes colgado pa verlo?

pera que lo estoy probando y yá veo esos 100px aprox que deja en la parte de arriba.

Pues lo estudio un poco a ver qué saco en claro.

De todas formas la popup ha de tener sí o sí esas dimensiones?
  #8 (permalink)  
Antiguo 03/06/2003, 09:42
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Ok... qué emocionante todo esto, a ver;

Cita:
Ya, no me refería a fullscreen, si no una popup del tamaño de la resolución.
Ah!.. ok, ya, pero igual no me sirve.

Cita:
Lo tienes colgado pa verlo?
No... es una intranet... y es complicadísimo convertirla porque está hecha en portal... ni caso tiene.

Cita:
pera que lo estoy probando y yá veo esos 100px aprox que deja en la parte de arriba.

Pues lo estudio un poco a ver qué saco en claro.
más y más gracias.

Cita:
De todas formas la popup ha de tener sí o sí esas dimensiones?
Ay!!! si...
  #9 (permalink)  
Antiguo 03/06/2003, 10:40
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
leches que me ha volvío loca.

Pues fíjate que si sacamos la cuenta, pone la ventana en su lugar, puesto que el ancho de resolución menos el ancho de la popup dividido entre dos da 5 (a 800x600) y el alto de resolución menos el alto de la popup dividido entre dos da 20. A esas posiciones coloca la ventana, pero queda mal

a 1024 en cambio se ve perfecto.

Mi sugerencia:

Si la resolución es a 800 la popup tiene exactamente (o casi) las dimensiones de la resolución y donde le vendría bien colocarse es a posición 0,0

El "parche" que te sugiero es poner un condicional que diga que si la resolución es de 800 que coloque la ventana popup a 0,0

mira

(pasando de la función de DW)

<body onload="xxx=window.open('','xxx','status=yes,width =790,height=531,top=' + (screen.availHeight-531)/2+',left=' + (screen.width-790)/2 + ',location=yes');if(screen.width==800){xxx.moveTo( 0,-10)}">

A ver si te sirve el parcheado
  #10 (permalink)  
Antiguo 03/06/2003, 12:01
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Un granito de arena

Hola otra vez:

Resulta que hay alguna incoherencia en este tema, ya que cuando damos proporciones a una ventana que vamos a abrir, en realidad estamos dando las proporciones del interior de la ventana, o sea el tamaño del body, pero toda ventana tiene su marco y su barra de título, que no sé como se averigua, pero cuando hablamos de posición parece ser que es la posición de la ventana y no del documento (body)

Haciendo intentos al azar descubrí que netscape tiene 2 atributos de ventanas que ayudan a atinar más con la ubicación, que son: window.outerWidth/outerHeight y innerWidth/Height...

O sea que con netscape es posible conseguir el centrado preciso, pero con explorer hasta ahora no hemos podido.

Voy a insertar el código que usé para pruebas:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Centrar popup</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT language=Javascript>
<!--
var ventana = false;
var ancho = 790;
var alto = 531;
var der = (screen.width - ancho) / 2;
var sup = (screen.height - alto) / 2;
function abrir() {
var propis = "menubars=no,toolbars=no,width=790,height=531,top= " + sup + ",left=" + der;
ventana = window.open("", "win", propis);
if (!document.all) alert(ventana.outerHeight);
ventana.document.write("<html><body><script>if (document.all) alert(document.body.offsetHeight)</script><center>Hola</center></body></html>");
}
//-->
</SCRIPT>
</head>
<body >
<input type=button onclick=abrir() value="Abrimos un pop-up">
</body>
</html>

Además en explorer usando document.body.offsetWidth/Height nos encontramos con un valor mayor que el que dimos en la apertura, pero evidentemente menor al valor de la ventana.

Espero que sea útil mi aportación...

Saludos
  #11 (permalink)  
Antiguo 03/06/2003, 12:25
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Cita:
, ya que cuando damos proporciones a una ventana que vamos a abrir, en realidad estamos dando las proporciones del interior de la ventana, o sea el tamaño del body, pero toda ventana tiene su marco y su barra de título,
caricatos,

me parece que esto que dices no es así. Recuerda el script `para abrir fotos en una popup que si le dábamos a la popup exactamente las dimensiones de la imagen se comía un trozo de imagen, precisamente porque el tamaño de la popup era exacto al de la imagen, por eso la barra de título y los bordes de la propia ventana se comían ese trocito de imagen.

Para corregirlo le tuve que sumar unos pocos pixels para la barra de título y esos bordes.

así que el tamaño de la ventana es completo, incluyendo sus barras, no define el tamaño del body.

Corrígeme si me equivoco, pero ese tema lo tocamos hace unos meses y fue precisamente al revés de como dices ahora.

saludos
  #12 (permalink)  
Antiguo 03/06/2003, 13:09
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Hola tunait:

La verdad es que me estás haciendo dudar... la verdad es que me acuerdo que había algún tema al respecto.

No sé si es como en las FAQs, pero ese caso, no se le da valores a la ventana, sino que según el tamaño de la foto, luego se redimensiona, pero yo hablo de poner en el open el width y el height.

Fíjate en este ejemplo:

var propis = "width=790,height=531";
ventana = window.open("", "", propis);

setTimeout("ventana.resizeTo(790, 531)", 3000);

Primero se abre la ventana de 790 x 531
Luego de 3 segundos se redimensiona a 790 x 531...

¿Cómo es que cambia el tamaño?

Si luego hacemos un alert preguntando por el ventana.document.body.clientWidth devuelve 780 (con mi versión del explorer y windows)

La verdad es que yo siempre abro las fotos con el tamaño de las imágenes, y me va bien (ya sabes, en la página de las caricaturas)

Un par de offtopics tunait...

Miré la precarga que te comentaba de KarlanKas y usa el mismo sistema de ".complete", así que parece que es "la solución definitiva" (es un decir)...
Y mi enhorabuena por la respuesta a malder (me dicen de este script)

Saludos
  #13 (permalink)  
Antiguo 03/06/2003, 13:16
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Tienes razón, es el resizeTo el que cuenta los pixels de la ventana completa no me había fijado antes.

Respecto al offtopic mejor te respondo en el post original

saludos
  #14 (permalink)  
Antiguo 04/06/2003, 10:29
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Algo más...

Hola otra vez:

¿Cómo no se me había ocurrido antes?

Me fijé en msdn de microchoff, ya que no podía creer que no hubieran "controlado" el tamaño de la ventana (no del contenido, sino del continente... )...
Aquí el link: http://msdn.microsoft.com/library/de...obj_window.asp

... y si bien parece que no hay información del tamaño real de la ventana, está el tamaño real de su ubicación con window.screenLeft y window.screenTop...

Voy a poner el ejemplo que he usado:

Código PHP:
<html>
<
head>
<
title>Centrar popup</title>
<
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<
SCRIPT language=Javascript>
<!--
var 
ventana false;
var 
ancho 790;
var 
alto 531;
var 
der = (screen.width ancho) / 2;
var 
sup = (screen.height alto) / 2;
function 
abrir()    {
    var 
propis "menubars=no,toolbars=no,width=790,height=531,top=" sup ",left=" der;
    
ventana window.open("""win"propis);
    if (!
document.allalert(ventana.outerHeight);
    else
        
setTimeout('ventana.moveTo(der - (ventana.screenLeft - der), sup - (ventana.screenTop - sup))'3000);
}
//-->
</SCRIPT>
</head>
<body >
<input type=button onclick=abrir() value="Abrimos un pop-up">
</body>
</html> 
Faltaría poner el desarrollo del moveTo para netscape... pero lo haré en otra ocasión, o si alguien quiere hacerlo...

Espero que sea algo útil...


Saludos

-----------------------------------------------------------------------
Algunos minutos después...
-----------------------------------------------------------------------

No me pude resistir, y preparé el script para netscape:
completo sería así:

if (!document.all)
'ventana.moveTo(der - (ventana.outerWidth - ancho), sup - (ventana.outerHeight - alto));
else
ventana.moveTo(der - (ventana.screenLeft - der), sup - (ventana.screenTop - sup));

También funciona en opera 7.

Saludos
  #15 (permalink)  
Antiguo 04/06/2003, 11:03
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Bueno muchachos... muchas gracias de nuevo (ya tengo vergüenza y todo...).

La opción de caricatos funcionó un poco mejor, pero no del todo.
(Le cambié el "onclick" que le puso al botón por el "onload" en la etiqueta del body, pero eso no importa...)

Digamos que en lugar de desplazarme los 100 px del top que había mencionado antes, ahora me desplaza sólo 40...

Así que ni maíz...

Lo que he hecho temporalmente es combinar la opción de centrar horizontalmente (que ha funcionado perfectamente) con la de fijar verticalmente el popup a 0 px del top. De este modo lo centro sin problema en 800x600 y digamos que los usuarios de resoluciones superiores no joden tanto...

...por si les interesa, queda así:

Cita:
<html>
<head>
<title></title>
<script language="JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features)
}
//-->
</script>
</head>

<body onLoad="MM_openBrWindow('http://www.xxxx.com','win','status=yes,width=790,height=5 31,top=0,left=' + (screen.width-790)/2 + ',location=yes')" >
</body>
</html>
Igual es rarísimo, no?
  #16 (permalink)  
Antiguo 04/06/2003, 11:47
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Hola otra vez:

/I-: Me había olvidado que usabas una función hecha, y lo que te planteaba es usar una función distinta a la que tienes, con la intención de poder desplazar la ventana al centro después de haberla abierto... si tienes dudas de como hacerlo, te lo puedo indicar... tú sabrás si te conformas con lo que tienes...

... y no te de verguenza, que te ayudamos con gusto...

Saludos
  #17 (permalink)  
Antiguo 04/06/2003, 11:48
Avatar de Helbira  
Fecha de Ingreso: octubre-2001
Ubicación: Sevilla, España
Mensajes: 1.228
Antigüedad: 22 años, 6 meses
Puntos: 5
En realidad el centrado tampoco es perfecto a una resolución de 1024. Parece que no cuenta con la barrita azul (donde se coloca el title). Por tanto no se tendria que contar con los 20 pixels que tiene de alto el titulo de la ventana sólo en la resolución de 800x600 sino para cualquier resolución.
  #18 (permalink)  
Antiguo 04/06/2003, 12:41
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Hola otra vez:

Helbira (tanto tiempo )

Probaste la versión que puse que redimensiona la ventana...

Yo tengo 1024 x (no lo sé bien, pero creo que es 768)... y probé abrir una página con 700 de altura, y entraba toda... aunque la misma prueba en netscape iba mejor...

Saludos
  #19 (permalink)  
Antiguo 04/06/2003, 13:58
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 2 meses
Puntos: 772
Hola a todos.

Interesante mensaje. He aprendido unas cuantas cosas y descubierto algunas propiedades nuevas (screenLeft, screenTop,...)

He probado el código de caricatos (Hola ) y ha funcionado dabuten (es decir muy bien).

Saludos,

P.D. ¿Que demonios hace este mensaje en el Foro de HTML?
¿Donde anda nuestra Moderadora?
  #20 (permalink)  
Antiguo 04/06/2003, 14:44
Avatar de /I-
/I-
 
Fecha de Ingreso: febrero-2003
Ubicación: ='o'=
Mensajes: 103
Antigüedad: 21 años, 2 meses
Puntos: 0
Cita:
Mensaje Original por caricatos
Hola otra vez:

/I-: Me había olvidado que usabas una función hecha, y lo que te planteaba es usar una función distinta a la que tienes, con la intención de poder desplazar la ventana al centro después de haberla abierto... si tienes dudas de como hacerlo, te lo puedo indicar... tú sabrás si te conformas con lo que tienes...

... y no te de verguenza, que te ayudamos con gusto...

Saludos
No no no... no partí de la función de dreamweaver.
Cuando usé tu código lo hice desde ceros. El código que pegué luego es el resultado de mi frustración al ver que tampoco tu opción me ayudaba a encajar en el centro exacto. Pero igual y de nuevo, gracias.
  #21 (permalink)  
Antiguo 04/06/2003, 15:13
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Cita:
Mensaje Original por JavierB

P.D. ¿Que demonios hace este mensaje en el Foro de HTML?
¿Donde anda nuestra Moderadora?
Yaa yaa vengoo taba arreglando el índice de las FAQs


Trasladado al javascript forum
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 07:30.