Foros del Web » Programando para Internet » Javascript »

modificar tree para que se adapte al tamaño en pantalla

Estas en el tema de modificar tree para que se adapte al tamaño en pantalla en el foro de Javascript en Foros del Web. hola amigos acabo de adaptar un menu tipo outlook dentro de frames estos son <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>PIA Centro Universitario ...
  #1 (permalink)  
Antiguo 12/12/2007, 14:56
Avatar de chalchis  
Fecha de Ingreso: julio-2003
Mensajes: 1.773
Antigüedad: 20 años, 9 meses
Puntos: 21
Pregunta modificar tree para que se adapte al tamaño en pantalla

hola amigos acabo de adaptar un menu tipo outlook dentro de frames estos son

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PIA Centro Universitario Hispano Mexicano</title>
</head>

<frameset rows="100,*,30" cols="*" frameborder="no" border="0" framespacing="0">
<frame src="<?echo $raiz.$interfaz.$php.$inte_cabezera;?>" name="<?echo $frcabezal?>" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />
<frameset cols="200,*,175" frameborder="no" border="0" framespacing="0">
<frame src="<?echo $raiz.$interfaz.$php.$inte_menu;?>" id="<?echo $frmenu;?>" name="<?echo $frmenu;?>" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame" />
<frame src="<?echo $raiz.$interfaz.$php.$inte_contenido;?>" name="<?echo $frcontendio;?>" id="mainFrame" title="mainFrame" />
<frame src="<?echo $raiz.$interfaz.$php.$inte_actividades;?>" name="<?echo $fractividad;?>" scrolling="No" noresize="noresize" id="rFrame" title="rFrame" />
</frameset>
<frame src="<?echo $raiz.$interfaz.$php.$inte_estatus;?>" name="<?echo $frestatus;?>" scrolling="No" noresize="noresize" id="pieFrame" title="topFrame" />
</frameset>
<noframes><body>
</body>
</noframes></html>


donde menu es donde se carga el archivo que comento

aqui esta mi menu tipo outlook

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="../Css/menu.css" rel="stylesheet" type="text/css" />
<title>Documento sin t&iacute;tulo</title>
</head>
<body >
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" background="../Imagen/inter_menu_bg.jpg">
<table width="191"border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div id="contenedor_menu">
<div id="AccordionContainer" class="AccordionContainer">
<div onclick="expander(1)">
<div class="AccordionTitle">
Accordion 1
</div>
</div>
<div id="Accordion1Content" class="AccordionContent">
I Am Accordion 1.
</div>

<div onclick="expander(2)">
<div class="AccordionTitle">
Accordion 2
</div>
</div>
<div id="Accordion2Content" class="AccordionContent">
I Am Accordion 2.
</div>
<div onclick="expander(3);">
<div class="AccordionTitle" onselectstart="return false;">
Accordion 3
</div>
</div>
<div id="Accordion3Content" class="AccordionContent">
I Am Accordion 3.
</div>
<div onclick="expander(4);">
<div class="AccordionTitle" onselectstart="return false;">
Accordion 4
</div>
</div>
<div id="Accordion4Content" class="AccordionContent">
I Am Accordion 4.
</div>
<div onclick="expander(5);">
<div class="AccordionTitle" onselectstart="return false;">
Accordion 5
</div>
</div>
<div id="Accordion5Content" class="AccordionContent">
I Am Accordion 5.
</div>
</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<script language="javascript">
var altoframe=parent.document.getElementById('frmenu') .offsetHeight;
//alert("el frame mide:"+altoframe);
var altocontenedor=document.getElementById('AccordionC ontainer').offsetHeight;
//alert("el contenedor del menu mide:"+altocontenedor);
var largamiento=altoframe-altocontenedor;
document.getElementById('contenedor_menu').style.h eight=altoframe+"px";
var anterior_modulo;



function expander(indice_modulo)
{
var idmodulo = "Accordion" + indice_modulo + "Content";
//alert(idmodulo);

if(anterior_modulo!=null)
{

document.getElementById(anterior_modulo).style.hei ght=0+"px";
document.getElementById(anterior_modulo).style.dis play='none';
//alert("anterior es:"+anterior_modulo);
}

if(idmodulo!=anterior_modulo)
{

document.getElementById(idmodulo).style.height=lar gamiento+"px";
document.getElementById(idmodulo).style.display='b lock';
anterior_modulo=idmodulo;
}
else
{
anterior_modulo=null;
}


}
</script>
</body>
</html>

este es el css
body
{
background-color: #ffffff;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}


.AccordionTitle, .AccordionContent, .AccordionContainer
{
position:relative;
width:188px;
}

.AccordionTitle
{
height:20px;
overflow: auto;
cursor:pointer;
font-family:Arial;
font-size:8pt;
font-weight:bold;
vertical-align: bottom;
text-align:center;
background-repeat:repeat-x;
display:table-cell;
background-image: url(../Imagen/Menu/title_repeater.jpg);
-moz-user-select:none;
}

.AccordionContent
{
height:0px;
overflow:auto;
display:none;
}

.AccordionContainer
{
border-top: solid 1px #C1C1C1;
border-bottom: solid 1px #C1C1C1;
border-left: solid 2px #C1C1C1;
border-right: solid 2px #C1C1C1;
}

mi pregunta es como adapto mi menu para que cuando redimensione la pantalla se adapte

saludos
__________________
gerardo
  #2 (permalink)  
Antiguo 13/12/2007, 15:18
Avatar de chalchis  
Fecha de Ingreso: julio-2003
Mensajes: 1.773
Antigüedad: 20 años, 9 meses
Puntos: 21
Sonrisa Re: modificar tree para que se adapte al tamaño en pantalla

solucionado
aqui

http://www.forosdelweb.com/f13/menu-...5/#post2217152


saludos
__________________
gerardo
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 04:25.