Scrolling en iframe no funciona!

m10locura · #1 (**permalink**) 12/02/2010, 13:17

Gente,

Tengo una pagina que no me esta mostrando el scrolling, esta armada con iframe.. pero no se por que catso no funciona! .. le paso el codigo..

</style>

</head>

<body>

<div id="container">
<div id="iFrame1" style="position:absolute; left:0px; top:0px; z-index:0">
<iframe name="iFrame1" width="808" height="170" src="header.html" scrolling="no" frameborder="0"></iframe>
</div>

<div id="iFrame2" style="position:absolute; left:0px; top:170px; z-index:1">
<iframe name="iFrame2" width="182" height="336" src="menu.html" scrolling="no" frameborder="0"></iframe>
</div>

<div id="central" style="position:absolute; left:181px; top:171px; z-index:2">
<iframe name="central" width="627" height="535" src="central.html" scrolling="auto" frameborder="0"></iframe>
</div>

<div id="iFrame3" style="position:absolute; left:0px; top:500px; z-index:3">
<iframe name="iFrame3" width="808" height="103" src="down.html" scrolling="no" frameborder="0"></iframe>
</div>

</div></body>
</html>

Esta es la web, si va la seccion contacto, le deberia mostrar el scrolling!

http://www.invertienremates.com.ar/

Ryo · #2 (**permalink**) 12/02/2010, 13:22

No muestra el scrolling porque no lo necesita: el formulario entra perfectamente. Lo que pasa es posiciones por encima del formulario otra cosa que lo tapa... Pero eso es distinto. Si quieres, pon scrolling="yes" para forzarlo.

m10locura · #3 (**permalink**) 12/02/2010, 13:27

En 1024*768 en formulario queda cortado.. no se ve el boton de "Enviar" ... no se que sera lo que decis que esta tapandolo, aca pongo el codigo completo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Invertienremates.com.ar</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="generator" content="Web Page Maker">

<style type="text/css">
/*----------Text Styles----------*/
.ws6 {font-size: 8px;}
.ws7 {font-size: 9.3px;}
.ws8 {font-size: 11px;}
.ws9 {font-size: 12px;}
.ws10 {font-size: 13px;}
.ws11 {font-size: 15px;}
.ws12 {font-size: 16px;}
.ws14 {font-size: 19px;}
.ws16 {font-size: 21px;}
.ws18 {font-size: 24px;}
.ws20 {font-size: 27px;}
.ws22 {font-size: 29px;}
.ws24 {font-size: 32px;}
.ws26 {font-size: 35px;}
.ws28 {font-size: 37px;}
.ws36 {font-size: 48px;}
.ws48 {font-size: 64px;}
.ws72 {font-size: 96px;}
.wpmd {font-size: 13px;font-family: 'Arial';font-style: normal;font-weight: normal;}
/*----------Para Styles----------*/
DIV,UL,OL /* Left */
{
margin-top: 0px;
margin-bottom: 0px;
}
</style>

<style type="text/css">
a.Menu:link{color:#7F7F7F;text-decoration: none;}
a.Menu:visited{color:#7F7F7F;text-decoration: none;}
a.Menu:hover{font-size:13px;color:#AAAAAA;}
a.Menu:active{color:#7F7F7F;}
a.MenuTop:link{color:#FFFFFF;text-decoration: none;}
a.MenuTop:visited{color:#FFFFFF;text-decoration: none;}
a.MenuTop:hover{color:#7F7F7F;}
a.MenuTop:active{color:#FFFFFF;text-decoration: none;}
</style>
<style type="text/css">
div#container
{
position:relative;
width: 808px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
text-align:left;
}
body {text-align:center;margin:0}
</style>

</head>

<body>

<div id="container">
<div id="iFrame1" style="position:absolute; left:0px; top:0px; z-index:0">
<iframe name="iFrame1" width="808" height="170" src="header.html" scrolling="no" frameborder="0"></iframe>
</div>

<div id="iFrame2" style="position:absolute; left:0px; top:170px; z-index:1">
<iframe name="iFrame2" width="182" height="336" src="menu.html" scrolling="no" frameborder="0"></iframe>
</div>

<div id="central" style="position:absolute; left:181px; top:171px; z-index:2">
<iframe name="central" width="627" height="535" src="central.html" scrolling="auto" frameborder="0"></iframe>
</div>

<div id="iFrame3" style="position:absolute; left:0px; top:500px; z-index:3">
<iframe name="iFrame3" width="808" height="103" src="down.html" scrolling="no" frameborder="0"></iframe>
</div>

</div></body>
</html>

Ryo · #4 (**permalink**) 12/02/2010, 13:31

Lo que hay debajo del formulario de contacto tiene una posición absoluta y un z-index superior al del formulario... Por tanto, si la posición absoluta haga a ese banner coincidir con la posición del formulario, el banner se pondrá por encima y "tapará" el formulario.

m10locura · #5 (**permalink**) 12/02/2010, 13:35

Solucionado! .. me fije y el iframe tenia un tamaño muy grande.. lo achique y listo! GRACIAS!

skar11 · #6 (**permalink**) 12/06/2010, 23:26

amigo, ya vi tu pagina y vi que solucionaste el problema... yo tengo un problema y me gustaria que me auxiliaras si no es mucha molestia..

resulta que tengo un formulario (asi como tienes tu en la pagina de contacto) pero con mas campos que rellenar y cuando lo acomodo dentro del scroll por alguna razon me lo desacomoda, no se si me puedas ayudar te lo agradeceria mucho... mi correo es [email protected].... este es mi codigo...

form id="form1" name="form1" method="post" action="enviarcorreo.php">
<div style="height:400px; width:595px; font:16px/26px Georgia, Garamond, Serif; overflow:Scroll; position:absolute; left: 244px; top: 281px;">

<label></label>
<label>
<input type="text" name="asunto" id="asunto" style="position:absolute;width:200px;left:333px;to p:299px;z-index:4" />
</label>
<p>
<label>

<input type="text" name="mail" id="mail" style="position:absolute;width:200px;left:608px;to p:298px;z-index:7" />
</label>
</p>
<p>
<label>
<input type="text" name="telefono" id="telefono" style="position:absolute;width:200px;left:333px;to p:331px;z-index:16" />
</label>
</p>
<label>

<p>
<input type="text" name="ciudad" id="ciudad" style="position:absolute;width:200px;left:333px;to p:362px;z-index:18" />
</label>
</p>
<div id="text" style="position:absolute; overflow:hidden; left:257px; top:450px; width:114px; height:28px; z-index:33">
<div class="wpmd">
<div><font class="ws16" face="Curlz MT">Productos:</font></div>
</div>

</div>
<p>
<label>
<input type="text" name="estado" id="estado" style="position:absolute;width:200px;left:608px;to p:330px;z-index:19" />
</label>
</p>
<p>
<label></label>
<select name="producto" id="producto" style="position:absolute;left:366px;top:456px;widt h:185px;z-index:32">
<option value="seleccione una opcion">selecciona una opcion </option>

<option value="book 1">book 1</option>
<option value="book 2">book 2</option>
<option value="book 3">book 3</option>
<option value="combo 1">combo 1</option>
<option value="combo 2">combo 2</option>
<option value="combo 3">combo 3</option>

</select>
</p>
<p>
<label>
<input type="text" name="edad" id="edad" style="position:absolute;width:35px;left:608px;top :362px;z-index:17" />
</label>
</p>
<p>
<label>
<input type="text" name="medidas" id="medidas" style="position:absolute;width:84px;left:724px;top :362px;z-index:20" />

</label>
</p>
<p>
<label>
<input type="text" name="ojos" id="ojos" style="position:absolute;width:120px;left:367px;to p:393px;z-index:23" />
</label>
</p>
<p>
<label>

<input type="text" name="peso" id="peso" style="position:absolute;width:41px;left:542px;top :393px;z-index:21" />
</label>
</p>
<p>
<label>
<input type="text" name="estatura" id="estatura" style="position:absolute;width:64px;left:703px;top :393px;z-index:25" />
</label>
</p>
<p>

<label>
<select name="servicio" id="servicio"style="position:absolute;left:367px;t op:426px;width:183px;z-index:26">
<option value="seleccione una opcion">selecciona una opcion</option>
<option value="Hombre">Hombre</option>
<option value="Mujer">Mujer</option>
<option value="Parejas">Parejas</option>
<option value="Todos">Todos</option>

</select>
</label>
</p>
<p>
<label></label>
<input type="text" name="horarios" id="horarios" style="position:absolute;width:83px;left:653px;top :425px;z-index:22" />
</p>
<p>
<label>

<select name="foto" id="foto" style="position:absolute; left:294px; top:687px; width:185px; z-index:32">
<option value="seleccione una opcion">selecciona una opcion </option>
<option value="Si">Si</option>
<option value="No">No</option>
<option value="De ninguna manera">De ninguna manera</option>
<option value="Deseo usar un antifaz">Deseo usar un antifaz</option>

</select>
</label>
</p>

<p> </p>
<p> </p>
<p> </p>
<p> </p>

<p> </p>
<p> </p>

<p> </p>
<p>
<label>
<textarea name="mensaje" id="mensaje" style="position:absolute; width:545px; height:125px; left:259px; top:514px; z-index:30;"></textarea>
</label>
</p>
<p> </p>
<p> </p>

<p>
<label></label>
</p>
<div id="text19" style="position:absolute; overflow:hidden; left:263px; top:654px; width:238px; height:27px; z-index:31">
<div class="wpmd">
<div>¿Quieres que aparesca tu foto?</div>
</div>
</div>
<p> </p>
<div id="text18" style="position:absolute; overflow:hidden; left:258px; top:483px; width:173px; height:27px; z-index:31">
<div class="wpmd">

<div><font class="ws16" face="Curlz MT">Texto de tu anuncio:</font></div>
</div>
</div>
<p>
<input type="file" name="file" style="position:absolute; left:398px; top:785px; z-index:34" />
</p>
<p>
<input type="file" name="file2" style="position:absolute; left:398px; top:825px; z-index:34" />
</p>

<p>
<input type="file" name="file3" style="position:absolute; left:398px; top:866px; z-index:34" />
</p>
<p>
<input type="file" name="file4" style="position:absolute; left:398px; top:905px; z-index:34" />
</p>
<p>
<input type="file" name="file5" style="position:absolute; left:398px; top:939px; z-index:34" />
</p>

<p>
<input type="file" name="file6" style="position:absolute; left:398px; top:976px; z-index:34" />
</p>
<p>
<input type="file" name="file7" style="position:absolute; left:398px; top:1012px; z-index:34" />
</p>
<p> </p>
<div id="text2" style="position:absolute; overflow:hidden; left:258px; top:294px; width:81px; height:28px; z-index:5"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Nombre:</font></div>

</div></div>

<div id="text3" style="position:absolute; overflow:hidden; left:546px; top:298px; width:59px; height:28px; z-index:6"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">E-mail:</font></div>
</div></div>

<div id="text4" style="position:absolute; overflow:hidden; left:256px; top:326px; width:81px; height:28px; z-index:8"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Telefono:</font></div>
</div></div>

<div id="text5" style="position:absolute; overflow:hidden; left:257px; top:356px; width:58px; height:28px; z-index:9"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Ciudad:</font></div>
</div></div>

<div id="text6" style="position:absolute; overflow:hidden; left:544px; top:325px; width:61px; height:28px; z-index:10"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Estado:</font></div>
</div></div>

<div id="text7" style="position:absolute; overflow:hidden; left:545px; top:358px; width:47px; height:28px; z-index:11"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Edad:</font></div>
</div></div>

<div id="text8" style="position:absolute; overflow:hidden; left:653px; top:360px; width:73px; height:28px; z-index:12"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Medidas:</font></div>
</div></div>

<div id="text9" style="position:absolute; overflow:hidden; left:496px; top:391px; width:46px; height:28px; z-index:13"><div class="wpmd">

<div><font class="ws16" face="Curlz MT">Peso:</font></div>
</div></div>

<div id="text10" style="position:absolute; overflow:hidden; left:255px; top:388px; width:113px; height:28px; z-index:14"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Color de ojos:</font></div>
</div></div>

<div id="text11" style="position:absolute; overflow:hidden; left:569px; top:424px; width:79px; height:28px; z-index:15"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Horarios:</font></div>

</div></div>

<div id="text12" style="position:absolute; overflow:hidden; left:623px; top:390px; width:79px; height:28px; z-index:24"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Estatura:</font></div>
</div></div>

<div id="text13" style="position:absolute; overflow:hidden; left:256px; top:421px; width:114px; height:28px; z-index:27"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">Preferencias:</font></div>
</div></div>

<div id="text14" style="position:absolute; overflow:hidden; left:585px; top:390px; width:30px; height:32px; z-index:28"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">kg.</font></div>
</div></div>

<div id="text15" style="position:absolute; overflow:hidden; left:773px; top:390px; width:34px; height:27px; z-index:29"><div class="wpmd">
<div><font class="ws16" face="Curlz MT">cm.</font></div>
</div></div>

<div id="text16" style="position:absolute; overflow:hidden; left:454px; top:743px; width:122px; height:27px; z-index:31">
<div class="wpmd">
<div>Envianos tus fotos</div>
</div></div>

<div id="text17" style="position:absolute; overflow:hidden; left:257px; top:450px; width:114px; height:28px; z-index:33">
<div class="wpmd">
<div><font class="ws16" face="Curlz MT">Productos:</font></div>
</div>
</div>

</body>
</html>
<p>
<input name="submit2" type="submit" value="Enviar" style="position:absolute; left:498px; top:1048px; z-index:34" />
</p>
<p> </p>
<p> </p>
<p> </p>
</div>
</form>