Ver Mensaje Individual
  #2 (permalink)  
Antiguo 05/06/2012, 13:30
Avatar de IsaBelM
IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: menu tipo acordeon desplegable

a ver si, mas o menos, es esto lo que quieres

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
.ocultar {display:none;}
.mostrar {display:block;}
.sel {color:#FF0000;}
.nosel {color:#000000;}
.selsub {color:#FFF555;}
.noselsub {color:#000000;}
</style>
<script type="text/javascript">
var visto_subm = null;
var visto_color = null;
function versubmenu(val) {
objhl = document.getElementById(val);
obj = document.getElementById('sub_' +val);

obj.className = (obj==visto_subm) ? 'ocultar' : 'mostrar';
objhl.className = (objhl==visto_color) ? 'nosel' : 'sel';

if ((visto_subm != null) && (visto_color != null)) {
visto_subm.className = 'ocultar';
visto_color.className = 'nosel';
}
//alert (visto_subm + " - " + visto_color)
//alert (obj + " - " + objhl)
visto_subm = (obj==visto_subm) ? null : obj;
visto_color = (obj==visto_color) ? null : objhl;
}


var visto_subsubm = null;
var visto_colorSUB = null;
function versubsubmenu(val) {
objhl = document.getElementById(val);
obj = document.getElementById(val+'sub');
obj.className = (obj==visto_subsubm) ? 'ocultar' : 'mostrar';
objhl.className = (objhl==visto_colorSUB) ? 'noselsub' : 'selsub';

if ((visto_subsubm != null) && (visto_colorSUB != null)) {
visto_subsubm.className = 'ocultar';
visto_colorSUB.className = 'noselsub';
}

visto_subsubm = (obj==visto_subsubm) ? null : obj;
visto_colorSUB = (obj==visto_colorSUB) ? null : objhl;
}
</script>
<head>
</head>
<body>
<div id="menu0" class="nosel" onclick="versubmenu(this.id)" style="z-index:1;">MENU0</div>
<div id="sub_menu0" class="ocultar" style="z-index:1;">
<div id="m00" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu0</div>
<div id="m00sub" class="ocultar" style="z-index:1;">
++ SubsubMenu0.0<br />
++ SubsubMenu0.1<br />
++ SubsubMenu0.2
</div>
<div id="m01" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu1</div>
<div id="m01sub" class="ocultar" style="z-index:1;">
++ SubsubMenu1.0<br />
++ SubsubMenu1.1
</div>
</div>


<div id="menu1" class="nosel" onclick="versubmenu(this.id)" style="z-index:1;">MENU1</div>
<div id="sub_menu1" class="ocultar" style="z-index:1;">
<div id="m10" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu0</div>
<div id="m10sub" class="ocultar" style="z-index:1;">
++ SubsubMenu0.0<br />
++ SubsubMenu0.1<br />
++ SubsubMenu0.2
</div>
<div id="m11" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu1</div>
<div id="m11sub" class="ocultar" style="z-index:1;">
++ SubsubMenu1.0<br />
++ SubsubMenu1.1
</div>
</div>


<div id="menu2" class="nosel" onclick="versubmenu(this.id)" style="z-index:1;">MENU2</div>
<div id="sub_menu2" class="ocultar" style="z-index:1;">
<div id="m20" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu0</div>
<div id="m20sub" class="ocultar" style="z-index:1;">
++ SubsubMenu0.0<br />
++ SubsubMenu0.1<br />
++ SubsubMenu0.2
</div>
<div id="m21" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu1</div>
<div id="m21sub" class="ocultar" style="z-index:1;">
++ SubsubMenu1.0<br />
++ SubsubMenu1.1
</div>
</div>


<div id="menu3" class="nosel" onclick="versubmenu(this.id)" style="z-index:1;">MENU3</div>
<div id="sub_menu3" class="ocultar" style="z-index:1;">
<div id="m30" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu0</div>
<div id="m30sub" class="ocultar" style="z-index:1;">
++ SubsubMenu0.0<br />
++ SubsubMenu0.1<br />
++ SubsubMenu0.2
</div>
<div id="m31" class="nosel" onclick="versubsubmenu(this.id)" style="z-index:1;">+ SubMenu1</div>
<div id="m31sub" class="ocultar" style="z-index:1;">
++ SubsubMenu1.0<br />
++ SubsubMenu1.1
</div>
</div>

</body>
</html>
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}