Hola
Prueba con esto a modo de ejemplo
Código javascript
:
Ver original<html>
<style type="text/css">
.oculto {display:none}
</style>
<script type="text/javascript">
var visto_subm = null;
var visto_color = null;
function ver(num) {
objhl = document.getElementById(num);
obj = document.getElementById("sub"+num);
obj.style.display = (obj==visto_subm) ? 'none' : 'block';
objhl.style.color = (objhl==visto_color) ? 'black' : 'red';
if ((visto_subm != null) && (visto_color != null)) {
visto_subm.style.display = 'none';
visto_color.style.color = 'black';
}
//alert (visto_subm + " - " + visto_color)
//alert (obj + " - " + objhl)
visto_subm = (obj==visto_subm) ? null : obj;
visto_color = (obj==visto_color) ? null : objhl;
}
function ver1(num)
{
var t=setTimeout("ver("+num+")",1000) // Tarda 1 segundo en aparecer
}
function ver2(num)
{
var id = setInterval("ver("+num+")",1000); // Tarda 1 segundo en aparecer y parpadea durante 15 segundos
setTimeout("clearInterval("+id+")",15000);
}
</script>
<head>
</head>
<body>
Se puede usar ver, ver1 y ver2 por separado<br /><br />
<div id="0" onclick="ver(this.id)" style="z-index:1;">MENU0</div>
<div id="sub0" class="oculto" style="z-index:1;">
SubMenu0<br />
SubMenu0<br />
SubMenu0
</div>
<div id="1" onclick="ver(this.id)" style="z-index:1;">MENU1</div>
<div id="sub1" class="oculto" style="z-index:1;">
SubMenu1<br />
SubMenu1<br />
SubMenu1
</div>
<div id="2" onclick="ver(this.id)" style="z-index:1;">MENU2</div>
<div id="sub2" class="oculto" style="z-index:1;">
SubMenu2<br />
SubMenu2<br />
SubMenu2
</div>
<div id="3" onclick="ver(this.id)" style="z-index:1;">MENU3</div>
<div id="sub3" class="oculto" style="z-index:1;">
SubMenu3<br />
SubMenu3<br />
SubMenu3
</div>
</body>
</html>
Suerte