Foros del Web » Programando para Internet » Javascript »

Scroll manipulado desde afuera

Estas en el tema de Scroll manipulado desde afuera en el foro de Javascript en Foros del Web. Hola Tengo la siguiente inquietud. en una pagina tengo un Iframe y mi idea es que desde fuera del Iframe osea mi pagina, mediante dos ...
  #1 (permalink)  
Antiguo 14/10/2003, 10:13
Avatar de Phobos  
Fecha de Ingreso: abril-2001
Ubicación: sentado frente a un pc prestado
Mensajes: 375
Antigüedad: 22 años, 11 meses
Puntos: 2
Scroll manipulado desde afuera

Hola
Tengo la siguiente inquietud.
en una pagina tengo un Iframe y mi idea es que desde fuera del Iframe osea mi pagina, mediante dos botones manipular el scroll del iframe.

Se podra hacer???

Ademas de ocultar la barra de scroll del iframe.

Saludos
  #2 (permalink)  
Antiguo 19/10/2003, 04:48
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 4 meses
Puntos: 317
Hola Phobos :

Siempre que la página del iframe esté en tu servidor. No puedes manipular páginas con otro hostname.

Se me ocurre que este código lo puedes encontrar en cualquier "javascriptería", aunque no me parece algo muy práctico para hacer; ¿ por qué no usas las barras del marco ?. Los botones suenan bien; pero sólo 'suenan', en la vida real presentan sus problemas, el más obvio es la velocidad ( ¿ ya probaste desplazar todo un documento con los botones que hay a los extremos del scrollbar ? ); otro puede ser la ubicación relativa. Por ahora nos quedamos con éstos dos.

Hace poco tiempo participé en un tema donde Bravenap y Rafael postearon códigos interesantes, en ese caso para desplazar una imagen ampliada, pero creo que lo puedes adaptar a una página. La idea es crear una especie de pad con la forma y tamaño proporcional de tu página en el iframe, pero reducida; al mover el puntero sobre el pad, el documento real se va a desplazar a las mismas coordenadas, multiplicadas por el factor de ampliación, claro.

Te dejo un enlace al final.

Como un escript así se me hace complicado para escribirlo ( no sé si será la edad, pero me estoy volviendo demasiado vago ) posteo algo más parecido a lo que pides. Reemplacé los botones por mouseovers y mousedowns, y les dí tres velocidades con distintos tamaños de desplazamiento. Tú cámbialos a gusto.

Código:
<HTML>
<HEAD>
<TITLE> DESPLAZAR MARCO INTERNO.</TITLE>
<SCRIPT>
var pasoH=2;
var pasoV=4;
var despl,alto,ancho;

function arriba(vel){
despl=setInterval("marcoInt.scrollBy(0,-pasoV)",vel)
}
function izquierda(vel){
despl=setInterval("marcoInt.scrollBy(-pasoH,0)",vel)
}
function derecha(vel){
despl=setInterval("marcoInt.scrollBy(pasoH,0)",vel)
}
function abajo(vel){
despl=setInterval("marcoInt.scrollBy(0,pasoV)",vel)
}

function salto(a){
pasoH=(a==1) ? 300 : 2;
pasoV=(a==1) ? 240 : 4;
}
</SCRIPT>

<STYLE>
table.#direc TD{width:15px; height:15px; font:900 14px monospace; margin:0; text-align:center}
</STYLE>

</HEAD>

<BODY>
<H2>Desplaza contenido de <tt>iframe</tt> con botones.</H2>
Para IE5x FF1x.

<TABLE align=center cellpadding=0 cellspacing=0>
<TD>
<iframe src="bordescaracteres.htm" scrolling=no 
name=marcoInt id=marcoInt style="width:600px; height:300px; border:4px inset" ></iframe>
</TD>
<TD width=150 align=center>

<TABLE id=direc border=0 cellpadding=0 cellspacing=0><TR>
<TD colspan=3 rowspan=3> </TD>
<TD onmouseout="clearInterval(despl)" onmouseover="arriba(300)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:silver>&#9650;</TD>
<TD colspan=3 rowspan=3> </TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="arriba(100)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:gray>&#9650;</TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="arriba(10)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default>&#9650;</TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(300)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:silver>&#9668;</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(100)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:gray>&#9668;</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(10)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default>&#9668;</TD>
<TD style="cursor:help; font:bold 14px sans-serif; color:blue" title=
"Mueva el puntero sobre las flechas para cambiar velocidad y dirección.
Pulse el botón en las flechas para desplazamientos mayores."> ?</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="derecha(10)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default>&#9658;</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="derecha(100)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:gray>&#9658;</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="derecha(300)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:silver>&#9658;</TD>
</TR><TR>
<TD colspan=3 rowspan=3> </TD>
<TD onmouseout="clearInterval(despl)" onmouseover="abajo(10)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default>&#9660;</TD>
<TD colspan=3 rowspan=3> </TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="abajo(100)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:gray>&#9660;</TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="abajo(300)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
onmousedown="salto(1)" onmouseup="salto(0)" 
style=cursor:default;color:silver>&#9660;</TD>
</TR></TABLE>

</TD>
</TABLE>

</BODY>

</HTML>
Asegúrate de que el documento en el iframe sea lo bastante grande como para poder probar el alcance de los "botones". El código se muestra bien en 800×600.

saludos

furoya

http://www.forosdelweb.com/s57c8d849...msg148740.html

Última edición por furoya; 28/04/2005 a las 14:32
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 10:19.