Navegación en pop-up
Hola, estoy haciendo una página web en la cual la página de inicio tiene la opción de entrar en la página web o de salir. En principio necesito lo siguiente
-La opción de salir que cierre la ventana del navegador pero que salga un mensaje en un rectángulo de esos de aviso del sistema que de un mensaje y dos opciones: que el visitante acepta que se cierre la ventana (y que por lo tanto lo haga) y que no la cierre quedándose como esta.
Al darle a entrar se abre un pop-up donde se navegará. Me interesa ponerle un menu de navegación haciendo uso de enlaces (para los ejemplos ponme los link para palabras, ya lo cambiaría yo personalmente por imágenes, se como se hace). Como mínimo que incluya dirección hacia adelante, atrás, etc...
No me refiero a poner una url. Ejemplo.
Alguien se mete en una sección de la página desde otra, lo que no quiero es una imagen (con enlace, por supuesto) que vaya a la página donde esta el menu, sino a la página desde donde se a accedido a esta. Y el de adelante lo mismo.
Muchas gracias.
-La opción de salir que cierre la ventana del navegador pero que salga un mensaje en un rectángulo de esos de aviso del sistema que de un mensaje y dos opciones: que el visitante acepta que se cierre la ventana (y que por lo tanto lo haga) y que no la cierre quedándose como esta.
Al darle a entrar se abre un pop-up donde se navegará. Me interesa ponerle un menu de navegación haciendo uso de enlaces (para los ejemplos ponme los link para palabras, ya lo cambiaría yo personalmente por imágenes, se como se hace). Como mínimo que incluya dirección hacia adelante, atrás, etc...
No me refiero a poner una url. Ejemplo.
Alguien se mete en una sección de la página desde otra, lo que no quiero es una imagen (con enlace, por supuesto) que vaya a la página donde esta el menu, sino a la página desde donde se a accedido a esta. Y el de adelante lo mismo.
Muchas gracias.
1 respuesta
Respuesta de bobbin
1
Primero vamos a ver un ejemplo, y luego aclaro un par de puntos:
<html>
<script>
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
// Aquí escribimos el código en la página nueva.
w.document.write ("<html><script>function lanzar(url){window.opener.document.location=url;} function atras(){window.opener.history.go(-1);} function adelante(){window.opener.history.go(+1);}</scr" + "ipt><body>");
var txt = "<a href='javascript:lanzar(\"midireccion1\")'>midireccion1</a><br>";
txt += "<a href='javascript:lanzar(\"midireccion1\")'>midireccion2</a><br>";
txt += "<a href='javascript:atras()'>Atrás</a><br><a href='javascript:adelante()'>Adelante</a>";
txt += "</body></html>";
w.document.write (txt);
}
function Salir()
{
if (window.opener != null && "" + window.opener != "undefined")
{
// En este caso, la ventana es una ventana que no es la principal del navegador.
if (confirm ("¿Realmente desea 'Salir'?"))
{
w.close();
w = null;
top.close();
}
}
else
{
// La ventana es la principal. El sistema operativo preguntará antes de cerrarla.
top.close();
w.close();
}
}
</script>
<body>
<a href="javascript:Entrar()">Entrar</a>
<br>
<a href="javascript:Salir()">Salir</a>
</body>
</html>
Comprobarás que la ventana de pop-up se abre con javascript y se rellena también con javascript. Con esto logramos que se cargue antes y no se tome por un banner.
Los link de atrás y adelante no hacen nada si no hay páginas cargadas antes o después de aquella en la que estamos.
El escribir </scr" + "ipt> es porque si no los navegadores se chocan con un tag </script> (aunque está dentro de una cadena de javascript) y cortan el código por ahí (algo que no queremos que ocurra)
Más cosas: en la cadena txt que luego se usa para escribir la pantalla puedes meter cualquier cosa, desde tablas, código javascript,... todo lo que se usa en una página normal.
A la hora de cerrar la ventana se pregunta por si es la ventana principal del navegador, ya que si lo es, el navegador se encarga de preguntar si desea cerrarla. Si no es la ventana principal, entonces preguntamos. Cámbiale el mensaje por el que más te guste (evidente).
Y la última, desearte suerte y poder ver pronto tu página publicada en internet.
<html>
<script>
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
// Aquí escribimos el código en la página nueva.
w.document.write ("<html><script>function lanzar(url){window.opener.document.location=url;} function atras(){window.opener.history.go(-1);} function adelante(){window.opener.history.go(+1);}</scr" + "ipt><body>");
var txt = "<a href='javascript:lanzar(\"midireccion1\")'>midireccion1</a><br>";
txt += "<a href='javascript:lanzar(\"midireccion1\")'>midireccion2</a><br>";
txt += "<a href='javascript:atras()'>Atrás</a><br><a href='javascript:adelante()'>Adelante</a>";
txt += "</body></html>";
w.document.write (txt);
}
function Salir()
{
if (window.opener != null && "" + window.opener != "undefined")
{
// En este caso, la ventana es una ventana que no es la principal del navegador.
if (confirm ("¿Realmente desea 'Salir'?"))
{
w.close();
w = null;
top.close();
}
}
else
{
// La ventana es la principal. El sistema operativo preguntará antes de cerrarla.
top.close();
w.close();
}
}
</script>
<body>
<a href="javascript:Entrar()">Entrar</a>
<br>
<a href="javascript:Salir()">Salir</a>
</body>
</html>
Comprobarás que la ventana de pop-up se abre con javascript y se rellena también con javascript. Con esto logramos que se cargue antes y no se tome por un banner.
Los link de atrás y adelante no hacen nada si no hay páginas cargadas antes o después de aquella en la que estamos.
El escribir </scr" + "ipt> es porque si no los navegadores se chocan con un tag </script> (aunque está dentro de una cadena de javascript) y cortan el código por ahí (algo que no queremos que ocurra)
Más cosas: en la cadena txt que luego se usa para escribir la pantalla puedes meter cualquier cosa, desde tablas, código javascript,... todo lo que se usa en una página normal.
A la hora de cerrar la ventana se pregunta por si es la ventana principal del navegador, ya que si lo es, el navegador se encarga de preguntar si desea cerrarla. Si no es la ventana principal, entonces preguntamos. Cámbiale el mensaje por el que más te guste (evidente).
Y la última, desearte suerte y poder ver pronto tu página publicada en internet.
Muchas gracias por el código pero necesito alguna que otra aclaración.
Primero voy a la de cerrar la venta.
Según he entendido si la ventana del navegador es una (por llamarla de una manera) natural, la normal que sale cuando se abre este, no puedo poner mi propio mensaje, ¿verdad? Pero si se trata del pop-up sí, ¿no es así?
Siguiente pregunta con respecto a la navegación. Estoy intentando hacer lo siguiente. Corrígeme si no es posible o is he de hacer algún cambio:
La página web del pop-up que tenia hecho es independiente, es decir, como si se abriese una ventana nueva en la que le indico que documento html tiene que abrir. LO que le hice (eso es con un código que me pasaron y arreglando los problemillas que tuviera con alguna web de internet) fue quitarle todos los menús. Entonces, aquí la pregunta acerca de la navegación: es posible poner el código de navegación directamente en el documento "html independiente" de la página principal (es donde se permite entrar o cerrar la página)
Te agradezco mucho tu ayuda. Sera la página que más java scripts tenga que haya hecho.
Primero voy a la de cerrar la venta.
Según he entendido si la ventana del navegador es una (por llamarla de una manera) natural, la normal que sale cuando se abre este, no puedo poner mi propio mensaje, ¿verdad? Pero si se trata del pop-up sí, ¿no es así?
Siguiente pregunta con respecto a la navegación. Estoy intentando hacer lo siguiente. Corrígeme si no es posible o is he de hacer algún cambio:
La página web del pop-up que tenia hecho es independiente, es decir, como si se abriese una ventana nueva en la que le indico que documento html tiene que abrir. LO que le hice (eso es con un código que me pasaron y arreglando los problemillas que tuviera con alguna web de internet) fue quitarle todos los menús. Entonces, aquí la pregunta acerca de la navegación: es posible poner el código de navegación directamente en el documento "html independiente" de la página principal (es donde se permite entrar o cerrar la página)
Te agradezco mucho tu ayuda. Sera la página que más java scripts tenga que haya hecho.
En la primera tienes toda la razón. Si la ventana no ha sido abierta con javascript, el navegador se quejará al intentar cerrarla.
Respecto a la segunda, sí, puedes poner el código javascript en la ventana y llamar a las funciones desde el popup de la siguiente forma:
<a href='javascript:window.opener.funcion(parametro1,parametro2,...)'>...</a>
Hay que tener en cuenta que la función a la que llamemos no debe devolver ningún valor.
Chao
Respecto a la segunda, sí, puedes poner el código javascript en la ventana y llamar a las funciones desde el popup de la siguiente forma:
<a href='javascript:window.opener.funcion(parametro1,parametro2,...)'>...</a>
Hay que tener en cuenta que la función a la que llamemos no debe devolver ningún valor.
Chao
Tras hacer muchas pruebas no he conseguido que funcione. Se abre la página bien, sin indicar errores, pero cuando se le da a un link (menos el de abrir nueva ventana) da error de página. He probado de todo: cambiar la ' por " (en la que funciona lo tenia así, pero con la navegación no va), a ponerles justo después de () un ;... de todo, haciendo el camboi que me dijiste de poner windows.opener.función (he probado cambiar "funcion" (la de tu ejemplo de la aclaración), por ejemplo, por atrás(), a poner toda la ristra de
window.opener.history.go(-1); etc, etc.
Te mando el código que tengo ahora mismo hecho, me lo puedes corregir, ¿por favor? Si ves que lo que esta antes del body esta bien no hace falta que lo repitas. Por cierto, también he cambiado <script> y le he puesto lo de languaje=javascript para ver si así también fucnioanaba.
<html>
<head>
<SCRIPT language = "javascript">
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
}
function lanzar(url)
{
window.opener.document.location=url;
}
function atras()
{
window.opener.history.go(-1);
}
function adelante()
{
window.opener.history.go(+1);
}
</script>
<title> pruebas de navegacion </title>
</head>
<body>
<a href="javascript:Entrar();">Entrar</a>
<a href='javascript:window.opener.lanzar("Copia de index.html")'>midireccion1</a>
<a href='javascript:window.opener.lanzar(\"midireccion2\")'>midireccion2</a>
<a href='javascript:window.opener.atras()'>Atrás</a>
<a href='javascript:window.opener.adelante()'>Adelante</a>
</body>
</html>
muchiiisimas gracias por tu atención y tu rapidez!
window.opener.history.go(-1); etc, etc.
Te mando el código que tengo ahora mismo hecho, me lo puedes corregir, ¿por favor? Si ves que lo que esta antes del body esta bien no hace falta que lo repitas. Por cierto, también he cambiado <script> y le he puesto lo de languaje=javascript para ver si así también fucnioanaba.
<html>
<head>
<SCRIPT language = "javascript">
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
}
function lanzar(url)
{
window.opener.document.location=url;
}
function atras()
{
window.opener.history.go(-1);
}
function adelante()
{
window.opener.history.go(+1);
}
</script>
<title> pruebas de navegacion </title>
</head>
<body>
<a href="javascript:Entrar();">Entrar</a>
<a href='javascript:window.opener.lanzar("Copia de index.html")'>midireccion1</a>
<a href='javascript:window.opener.lanzar(\"midireccion2\")'>midireccion2</a>
<a href='javascript:window.opener.atras()'>Atrás</a>
<a href='javascript:window.opener.adelante()'>Adelante</a>
</body>
</html>
muchiiisimas gracias por tu atención y tu rapidez!
Ok, lo entendí mal, pero por lo que veo me parece que el menú se va a quedar en la página principal.
Bueno, entonces el código cambia:
<html>
<head>
<SCRIPT language = "javascript">
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
}
function lanzar(url)
{
if (w != null && !w.closed)
w.document.location=url;
}
function atras()
{
if (w != null && !w.closed)
w.slef.history.go(-1);
}
function adelante()
{
if (w != null && !w.closed)
w.self.history.go(+1);
}
</script>
<title> pruebas de navegacion </title>
</head>
<body>
<a href="javascript:Entrar();">Entrar</a>
<a href='javascript:lanzar("Copia de index.html")'>midireccion1</a>
<a href='javascript:lanzar(\"midireccion2\")'>midireccion2</a>
<a href='javascript:atras()'>Atrás</a>
<a href='javascript:adelante()'>Adelante</a>
</body>
</html>
Una aclaración.
Los botones de lanzar funcionan sólo si la página que está cargada pertenece a tu dominio.
Si quieres que al pulsar entrar entre directamente en "Copia de index.html", sólo tienes que cambiar 'about:blank' en la función Entrar() por "Copia de index.html".
Chao
Bueno, entonces el código cambia:
<html>
<head>
<SCRIPT language = "javascript">
var w = null;
function Entrar()
{
w=window.open ('about:blank','_blank');
}
function lanzar(url)
{
if (w != null && !w.closed)
w.document.location=url;
}
function atras()
{
if (w != null && !w.closed)
w.slef.history.go(-1);
}
function adelante()
{
if (w != null && !w.closed)
w.self.history.go(+1);
}
</script>
<title> pruebas de navegacion </title>
</head>
<body>
<a href="javascript:Entrar();">Entrar</a>
<a href='javascript:lanzar("Copia de index.html")'>midireccion1</a>
<a href='javascript:lanzar(\"midireccion2\")'>midireccion2</a>
<a href='javascript:atras()'>Atrás</a>
<a href='javascript:adelante()'>Adelante</a>
</body>
</html>
Una aclaración.
Los botones de lanzar funcionan sólo si la página que está cargada pertenece a tu dominio.
Si quieres que al pulsar entrar entre directamente en "Copia de index.html", sólo tienes que cambiar 'about:blank' en la función Entrar() por "Copia de index.html".
Chao
Espero que no te moleste que te siga preguntando cosas sobre el código.
Estos los quería poner en cada documento html ya que el pop-up que se abre no tiene menu alguno. Así puedo permitir al que visita la página poder ir hacia atrás como si tuviese el menu. El caso es he probado el menu en local y no me dirige a nua página que esta en la misma carpeta (lo he hecho con abrir->nuevo->explrar...).
Te agradezco mucho tu atención e interés.
(Viste que el ejemplo parecía que estaba en la página principal porque era donde hacia pruebas, adelante y ataras estará en cada documento html que formaran la página menos la principal que es donde estarán entrar y salir)
Estos los quería poner en cada documento html ya que el pop-up que se abre no tiene menu alguno. Así puedo permitir al que visita la página poder ir hacia atrás como si tuviese el menu. El caso es he probado el menu en local y no me dirige a nua página que esta en la misma carpeta (lo he hecho con abrir->nuevo->explrar...).
Te agradezco mucho tu atención e interés.
(Viste que el ejemplo parecía que estaba en la página principal porque era donde hacia pruebas, adelante y ataras estará en cada documento html que formaran la página menos la principal que es donde estarán entrar y salir)
Para moverte por las páginas los enlaces son iguales que los de la página que te envié.
El código cambia un pelín:
<script>
function atras()
{
self.history.go(-1);
}
function adelante()
{
self.history.go(+1);
}
</script>
Son un poco más sencillas que las que se usan desde el menú principal.
Una cosa más, en el código corregido, en la función atrás, escribí slef y lo correcto es self.
Bueno, si tienes más dudas no dudes en preguntar, que para eso estoy aquí ;)
El código cambia un pelín:
<script>
function atras()
{
self.history.go(-1);
}
function adelante()
{
self.history.go(+1);
}
</script>
Son un poco más sencillas que las que se usan desde el menú principal.
Una cosa más, en el código corregido, en la función atrás, escribí slef y lo correcto es self.
Bueno, si tienes más dudas no dudes en preguntar, que para eso estoy aquí ;)
Muchísimas gracias. Si no fuera porque no puedo te habría dado matricula de honor. La url de la página es www.acampos.net pero de momento no tengo nada colgado (ahora mismo te encontarias con una página sin enlaces)
