Foros del Web » Creando para Internet » HTML »

Iframe en 2 partes 20% y 80%

Estas en el tema de Iframe en 2 partes 20% y 80% en el foro de HTML en Foros del Web. Buenas, necesito para salvar una web que tengo hecha un codigo que tenga 2 iframes el primero que cargue al 20% de altura el menu ...
  #1 (permalink)  
Antiguo 07/08/2015, 13:53
 
Fecha de Ingreso: octubre-2006
Mensajes: 24
Antigüedad: 18 años
Puntos: 0
Iframe en 2 partes 20% y 80%

Buenas, necesito para salvar una web que tengo hecha un codigo que tenga 2 iframes el primero que cargue al 20% de altura el menu y el segundo que cargue al 80% de altura el cuerpo de la web.

Alguien sabe como podria hacerlo, he probado directamente con el iframe y no me funciona supongo que tendria que ser acompañado de css o javascript.

Muchas gracias.
  #2 (permalink)  
Antiguo 07/08/2015, 18:14
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 9 años, 4 meses
Puntos: 263
Respuesta: Iframe en 2 partes 20% y 80%

pasa tu archivo principal de html a php y utiliza los include:
Código PHP:
Ver original
  1. <?php include('rutadetumenu/menu.html'); ?>

igual para el cuerpo, o carga el menu con un include y el cuerpo en un iframe por ejemplo
__________________
[email protected]
HITCEL
  #3 (permalink)  
Antiguo 08/08/2015, 02:03
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 8 meses
Puntos: 1826
Respuesta: Iframe en 2 partes 20% y 80%

Revisa esto: http://www.forosdelweb.com/f91/hable...munes-1048430/

y no uses iframes.
  #4 (permalink)  
Antiguo 08/08/2015, 03:36
 
Fecha de Ingreso: octubre-2006
Mensajes: 24
Antigüedad: 18 años
Puntos: 0
Respuesta: Iframe en 2 partes 20% y 80%

Pero como puedo poner lo del 80% y 20% en lo del include, perdonad pero no domino casi nada del tema.

Muchas gracias
  #5 (permalink)  
Antiguo 08/08/2015, 05:14
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 9 años, 4 meses
Puntos: 263
Respuesta: Iframe en 2 partes 20% y 80%

asi insertas las secciones en tu pagina principal:
Código PHP:
Ver original
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Documento sin título</title>
  6. </head>
  7.  
  8. <body>
  9. <!--area de menu-->
  10. <?php include('menu.php'); ?>
  11.  
  12. <!--area de contenido-->
  13. <?php include('contenido.php'); ?>
  14. </body>
  15. </html>

asi debes tener la pagina que vas a cargar en contenido con el iframe:
Código Javascript:
Ver original
  1. <script>
  2.                     if (window.innerHeight){
  3.                         //navegadores basados en mozilla
  4.                         espacio_iframe = window.innerHeight - 110
  5.                         }else{
  6.                     if (document.body.clientHeight){
  7.                         //Navegadores basados en IExplorer, es que no tengo innerheight
  8.                         espacio_iframe = document.body.clientHeight - 110
  9.                         }else{
  10.                         //otros navegadores
  11.                         espacio_iframe = 478
  12.                         }
  13.                     }
  14.                     document.write ('<iframe name="texte" frameborder="0" src="vacia.php" width="100%" height="' + espacio_iframe + '">')
  15.                     document.write ('</iframe>')
  16.                 </script>
  17.                 <!--------fin del script-------------------------------------------------->
  18.                 <noscript>
  19.                 <iframe id="texte" name="texte" src="vacia.php" width="100%" frameborder="0" scrolling="no"></iframe>
  20.                 </noscript>
yo tengo una aplicacion que carga un menu diferente dependiendo de los privilegios que tenga el usuario que ingresa y la tengo conformada de esa manera, de tal manera que si pinchan en el menu, este se carga en el iframe de contenido por ejemplo, juega con los valores
__________________
[email protected]
HITCEL
  #6 (permalink)  
Antiguo 09/08/2015, 02:49
 
Fecha de Ingreso: octubre-2006
Mensajes: 24
Antigüedad: 18 años
Puntos: 0
Respuesta: Iframe en 2 partes 20% y 80%

Perdona es que de php y javascript tengo 0 conocimientos.

Yo tengo un cuerpo.html que es el cuerpo de la web.

Tengo un menu.html que es el menu.

Por lo que entiendo los tendria que guardar con extension php. hasta ahi creo que lo he pillado.

El codigo php que me has puesto supongo que seria el index.php pero tengo alguna duda en que linea de codigo llama al javascript o no hace falta?

El Javascript lo hago en un archivo aparte o justo debajo del php?

El Javascript llama a un archivo vacia.php con que codigo lo he de crear?

Y en que parte del codigo le dijo que el menu ocupara el 20% y el cuerpo el 80% siento ser tan torpe y quitarte tanto tiempo pero como te digo no tengo conocimientos sobre javascript ni php.

Perdona por las molestias y Muchas gracias.

Última edición por loadgo; 09/08/2015 a las 02:55
  #7 (permalink)  
Antiguo 09/08/2015, 10:51
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 9 años, 4 meses
Puntos: 263
Respuesta: Iframe en 2 partes 20% y 80%

ok debes jugar con los códigos y combinas html, css y php para lograr algunas cositas, por ejemplo:

index.php:

Código PHP:
Ver original
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Documento sin título</title>
  6. <style>
  7. /*Indicamos que la pagina tiene una altura del 100%*/
  8. html, body{
  9.     height:100%;
  10. }
  11. /*llevamos los margenes de la pagina a 0*/
  12. body{
  13.     margin:0px;
  14. }
  15. /*Asignamos el espacio que ocupara el div del menu*/
  16. .menu{
  17.     height:20%;
  18.     background-color:#000000;
  19.     color:#FFFFFF;
  20. }
  21. /*Asignamos el espacio que ocupara el iframe del contenido*/
  22. .contenido{
  23.     height:80%;
  24.     background-color:#00437B;
  25. }
  26. </style>
  27. </head>
  28.  
  29. <body>
  30. <!--area de menu-->
  31. <div class="menu">
  32. <?php include('menu.php'); ?>
  33. </div>
  34.  
  35. <!--area de contenido-->
  36. <div class="contenido">
  37. <?php include('contenido.php'); ?>
  38. </div>
  39. </body>
  40. </html>
El codigo css lo puedes cargar desde un archivo externo para limpiar el codigo un poco

el javascript lo vas a colocar en la pagina contenido.php ya que cuando cargues index este se va a ajustar al div que creaste para tal fin y el menu bueno dejalo alli.

recuerda que si tienes el menu en una pagina aparte debes eliminar las etiquetas de apertura como <html><head><body> y cierre de esas para evitar conflictos, solo deja la estructura interna del codigo de tu menu, por ejemplo <ul><li>ITEM</li></ul>
__________________
[email protected]
HITCEL

Última edición por xfxstudios; 09/08/2015 a las 17:14
  #8 (permalink)  
Antiguo 09/08/2015, 20:44
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 8 meses
Puntos: 1826
Respuesta: Iframe en 2 partes 20% y 80%

Hay una opción mucho más sencilla para las alturas, no es 100% compatible pero es muy bueno.

Código HTML:
Ver original
  1. div.20 {height:20vh; background-color: #F00;}
  2. div.80 {height:80vh; background-color: #0F0;}

Otra es definir el html y body al 100%

Código HTML:
Ver original
  1. body, html {height: 100%;}
  2. div.20 {height: 20%;}
  3. div.80 {height: 80%;}

Etiquetas: css, iframe, javascript, partes
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 13:45.