Javascript dentro de un frame

aecio451 · #1 (**permalink**) 22/04/2011, 09:03

Saludos, estoy haciendo una página que contiene 2 frames, uno superior que sirve de cabecera, y otro inferior. El frame inferior, está dividido a su vez en 3 frames, dos laterales que contienen los menús, uno a la izquierda y otro a la derecha; y uno central que es el que me muestra el contenido de la página como tal. El código es el siguiente:

Código HTML:

<html>
<head>
<title>E-Shop</title>
</head>

<frameset rows="10%,*" border="0"> 

     <frame src="logo.html">
     
     <frameset cols="9%,*,13%">
     
     	<frame name="lateralizq" src="menu_materiales_izq.html" scrolling="no">
        
   		<frame name="cuerpo" src="cuerpo.html" scrolling="no">
        
     	<frame name="lateralder" src="menu_materiales_der.html" scrolling="no">
        
     </frameset> 
</frameset><noframes></noframes>


</html>

Como se puede ver he eliminado la scrollbar de los frames. La idea es que el frame llamado "menu_materiales_der.html", el cual es el menu de la derecha, tenga un scroll, pero sin usar la barra, o sea con botones de subir y bajar, que permitan subir y bajar el contenido del frame cuando pasa el ratón sobre esos botones. He aquí el código javascript dentro del frame "menu_materiales_der.html":

Código:

<script type="text/javascript">

//Scrollable content III- By http://www.dynamicdrive.com

var speed, currentpos=curpos1=0,alt=1,curpos2=-1

function initialize(){
if (window.parent.scrollspeed!=0){
speed=window.parent.scrollspeed;
scrollwindow();
}
}

function scrollwindow(){
temp=(document.all)? document.body.scrollTop : window.pageYOffset
alt=(alt==0)? 1 : 0
if (alt==0)
curpos1=temp;
else
curpos2=temp;

window.scrollBy(0,speed);
}

setInterval("initialize()",10);

    </script>

Y aquí está el código para los scrolls

Código HTML:

<p><a href="#" onMouseover="scrollspeed=-4" onMouseout="scrollspeed=0">Subir</a></p> <!-- Subir -->

<p><a href="#" onMouseover="scrollspeed=4" onMouseout="scrollspeed=0">Bajar</a></p> <!-- Bajar -->

Este código me funciona cuando está en una sola página, el problema está cuando lo coloco dentro de un frame, ya que al pasar el ratón sobre los botones, el contenido no sube ni baja, es decir, se queda estático.

Alguna sugerencia????

Danielfuzz · #2 (**permalink**) 23/04/2011, 17:01

Hola, donde estas poniendo el codigo para los scrolls?? en que frame??

aecio451 · #3 (**permalink**) 23/04/2011, 22:48

Hola Danielfuzz, en este frame es que estoy poniendo los scrolls:

<frame name="lateralder" src="menu_materiales_der.html" scrolling="no">

el cual es el menú de la derecha de mi página.

Gracias por responderme.

Danielfuzz · #4 (**permalink**) 24/04/2011, 20:08

hola aecio451, a primera vista se podria decir que talvez se deba a alguna falla en la referencia que haces en tu javascript, me refiero al document y al window, dejame ver un momento a ver si hallo algo, pero te recomiendo que mas bien uses jquery para este tipo de cosas y no hagas tanto uso de los frames, masbien uses div o algo así

Danielfuzz · #5 (**permalink**) 24/04/2011, 20:26

bueno ya encontre el problema, en tu script haces referencia al nodo padre que contiene tu frame porq pones window.parent cuando en realidad deberias poner window, y para que se note lo que baja el scroll deberias aumentarle unas lineas mas a tu html que tiene el scrolling de modo que el contenido de este frame rebase su tamano y se vea el srolling.

te adjunto el codigo modificado del frame que hace el scroll:

Código HTML:

<script type="text/javascript">

//Scrollable content III- By http://www.dynamicdrive.com

var speed, currentpos=curpos1=0, alt=1, curpos2=-1;

function initialize(){
	if (window.parent.scrollspeed!=0){
		speed=window.parent.scrollspeed;
		scrollwindow();
	}
}

function scrollwindow(){
	temp=(document.all)? document.body.scrollTop : window.pageYOffset
	alt=(alt==0)? 1 : 0
	if (alt==0)
curpos1=temp;
else
curpos2=temp;

window.scrollBy(0,speed);
}

setInterval("initialize()",10);

    </script>
    <p><a href="#" onMouseover="scrollspeed=-4" onMouseout="scrollspeed=0">Subir</a></p> <!-- Subir -->

<p><a href="#" onMouseover="scrollspeed=4" onMouseout="scrollspeed=0">Bajar</a></p> <!-- Bajar -->
<br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br><br /></br>hfhdfg

pero si te das el scrolling solo funciona mientras estés posicionado sobre el botón. Talvez dentro tu frame deberias poner un div que tenga el menu y tener los botones afuera para evitar esto.

Pero definitivamete usar tantos frames no es lo mejor, te recominedousar div en su lugar y si quieres un scrolling mediante botones puedes usar jquery para ello.

SAludos.

aecio451 · #6 (**permalink**) 25/04/2011, 19:15

Eres un crack Danielfuzz, lo he probado y me ha funcionado perfectamente, me has quitado un dolor de cabeza de encima. :)