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>▲</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>▲</TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="arriba(10)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default>▲</TD>
</TR><TR>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(300)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default;color:silver>◄</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(100)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default;color:gray>◄</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="izquierda(10)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default>◄</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>►</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="derecha(100)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default;color:gray>►</TD>
<TD onmouseout="clearInterval(despl)" onmouseover="derecha(300)"
onmousedown="salto(1)" onmouseup="salto(0)"
style=cursor:default;color:silver>►</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>▼</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>▼</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>▼</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