botones "next" y "back" de 1 frame a otro.

ErikaR · #1 (**permalink**) 21/03/2003, 15:56

Tengo un frameset conformado por 2 frames.
Quiero poner flechas de "next" y back" en el frame superior, al hacer click en ellas se va renovando el frame de abajo con los sucesivos 10 archivos.
Como seria el codigo para hacer estas flechitas? Se puede?

Si todo transcurriera en un mismo frame, y quisiera renovar los archivos con next y back? son 10 archivos que se suceden.
Se puede?

Muchas gracias

erika

FredNess · #2 (**permalink**) 21/03/2003, 16:02

primero que nada siganle un nombre al frame INFERIOR, por ejemplo

<frame name="_inferior"

Y dentro de una hoja HTML que este en tu frame superior hace links ATRAS o ADELANTE de esta forma

<a href="pagina_2.htm " target="_inferior">Adelante</a>

*pagina_2.htm de ejemplo

Con esto creas links con destinos diferentes...

ErikaR · #3 (**permalink**) 21/03/2003, 16:28

Gracias por responder!
Quiza mi pregunta no fue muy clara o no entendi la respuesta.

Quisiera lograr hacer como el back y next del navegador, agregandole la complicacion: desde un frame a otro.

Como se da cuenta el boton de "next", qué html cargar y luego de ese carga el proximo. Siempre desde el frame superior al inferior ?

Gracias
erika!

JavierB · #4 (**permalink**) 22/03/2003, 05:03

Hola, ErikaR.

A ver si te sirve esto:

<input type="button" value="atrás" onClick="parent.nombreFrame.history.back()">
<input type="button" value="adelante" onClick="parent.nombreFrame.history.forward()">

Saludos,

P.D. En el ejemplo he usado dos botones, pero te funcionará igual con imágenes.

ErikaR · #5 (**permalink**) 22/03/2003, 16:57

Gracias Javier!
El tema es que como no se mucho de codigo, me manejo con el dreamweaver, no se donde pegar este codigo!!!!!!!

A continuacion pego el codigo por si tuvieras ganas de intercalar el codigo que me explicas...quiza en otro color....

recorda que son 2 frames, 1 arriba otro abajo, el de arriba va haciendo < > sobre el frame de abajo trayendo cada vez otro html:

Ahi va:
<html>
<head>
<title>: : : Acrocomia : : :</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
A:link {
BACKGROUND: none;
COLOR: #ffffff;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
}
A:active {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
font-weight: bold;
}
A:visited {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
font-weight: bolder;
}
A:hover {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: underline;
}

</style>
</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="345" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td>
<div align="right"> < > <a href="acrocomia2.html" target="fotos">2
</a><a href="acrocomia3.html" target="fotos"> 3</a> <a href="acrocomia4.html" target="fotos">4</a>
<a href="acrocomia5.html" target="fotos"> 5</a><img src="imagenes/pixel.gif" width="15" height="5">
</div>
</td>
</tr>
</table>

<p class="homechiquita"> </p>
</body>
</html>

Muchas Gracias
erika

tunait · #6 (**permalink**) 23/03/2003, 07:49

JavierB · #7 (**permalink**) 23/03/2003, 10:22

Hola de nuevo.

Te pongo la parte del código que deberías cambiar:

<div align="right"><span onClick="parent.nombreFrame.history.back()"><</span> <span onClick="parent.nombreFrame.history.forward()">&gt ;</span> <a href="acrocomia2.html" target="fotos">2
</a><a href="acrocomia3.html" target="fotos"> 3</a> <a href="acrocomia4.html" target="fotos">4</a>
<a href="acrocomia5.html" target="fotos"> 5</a><img src="imagenes/pixel.gif" width="15" height="5">
</div>

A ver si nos vamos acercando a la solución. Saludos,

ErikaR · #8 (**permalink**) 24/03/2003, 09:14

Gracias JB! Nos vamos acercando!

El tema es que:

-Las flechitas de < > para avanzar y retroceder, al pasar el mouse no se hacen "manito" y no toman el color de los links como en los numeros...

-El retroceder funciona solo una vez que avance...

-Subi los archivos en http://www.erikarubaja.com.ar/prueba por si lo queres ver.

<td>
<div align="right"> <span onClick="parent.inferior.history.back()"><</span>
<span onClick="parent.inferior.history.forward()">></span> <a href="acrocomia2.html" target="inferior">2
</a><a href="acrocomia3.html" target="inferior"> 3</a> <a href="acrocomia4.html" target="inferior">4</a>
<a href="acrocomia5.html" target="inferior"> 5</a><img src="imagenes/pixel.gif" width="15" height="5">
</div>
</td>

Muchas Gracias
erika

JavierB · #9 (**permalink**) 24/03/2003, 12:01

Hola de nuevo.

Me alegro de que vayamos avanzando. A ver si de otro empujón...

<html>
<head>
<title>: : : Acrocomia : : :</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
A:link {
BACKGROUND: none;
COLOR: #ffffff;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
}
A:active {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
font-weight: bold;
}
A:visited {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: none;
font-weight: bolder;
}
A:hover {
BACKGROUND: none;
COLOR: #339966;
FONT-SIZE: 11px;
FONT-FAMILY: Verdana, Helvetica;
TEXT-DECORATION: underline;
}

</style>
<script>
var pag=1;
var maxPag=10; //numero máximo de páginas
function cambia(num) { //0-adelante 1-atras
if (num==0 && pag<maxPag) {
pag++;
parent.mainFrame.location.href='acrocomia'+pag+'.h tml'; }
else if (num==1 && pag>1) {
pag--;
parent.mainFrame.location.href='acrocomia'+pag+'.h tml'; }
}
</script>
</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="345" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td>
<div align="right"><a href="#" onClick="cambia(1)"><</a> <a href="#" onClick="cambia(0)">></a> <a href="acrocomia2.html" target="fotos">2
</a><a href="acrocomia3.html" target="fotos"> 3</a> <a href="acrocomia4.html" target="fotos">4</a>
<a href="acrocomia5.html" target="fotos"> 5</a><img src="imagenes/pixel.gif" width="15" height="5">
</div>
</td>
</tr>
</table>

<p class="homechiquita"> </p>
</body>
</html>

Saludos,