Menú desplegable algo distinto

[roylugones]

Quería saber como se hace un menú desplegable de la siguiente manera:

salen las secciones una debajo de otra, pero al dar a una de ellas todas las que tiene debajo se desplazan más abajo, y en ese espacio que quedan se colocan sub-secciones. ¿Me entienden?

Ejemplo:

Opción A
Opción B
Opción C
Opción D

Ahora seleccionamos la B por ejemplo y quedaría así:

Opción A
Opción B
-- Opción B1
-- Opción B2
-- Opción B3
Opción C
Opción D

Así, entienden?? Un saludo y muchas gracias por adelantado.

[levhita]

yo he usado algo como esto:

Me hago unos scripts que pueden esconder y mostrar elementos asumiendo que el id sea único.

Código:

<script type="text/javascript">
<!--
var browserType;
if (document.layers) {browserType = "nn4"}
if (document.all) {browserType = "ie"}
if (window.navigator.userAgent.toLowerCase().match("gecko")) {browserType= "gecko"}

function show(what) {
  if (browserType == "gecko" )
     document.poppedLayer = eval('document.getElementById(\''+what+'\')');
  else if (browserType == "ie")
     document.poppedLayer = eval('document.all[\''+what+'\']');
  else
     document.poppedLayer = eval('document.layers[\''+what+'\']');
  document.poppedLayer.style.display = "block";
}

function hide(what) {
  if (browserType == "gecko" )
     document.poppedLayer = eval('document.getElementById(\''+what+'\')');
  else if (browserType == "ie")
     document.poppedLayer = eval('document.all[\''+what+'\']');
  else
     document.poppedLayer = eval('document.layers[\''+what+'\']');
  document.poppedLayer.style.display = "none";
}
//-->
</script>

Y en el código hago algo como esto:

Código HTML:

<li><a href="javascript:show('cat1');">Categoría 1</a></li>
  <div id="cat1" style="display:none;">
    <!--  lista de sub enlaces-->
  </div> 

Sólo hay que extender el concepto a toda la lista.

[tunait]

Tema trasladado desde CSS

[roylugones]

Muchas gracias, todo perfecto ;)

[roylugones]

Bueno no, me falta una cosa.
A la hora de esconderlas, como hago para que al pinchar en una sección, me cierre todas las demás secciones???