Busco menu o como se le llama a este tipo de menu

[UsuarioArroba]

Tengo un blog en blogspot.com (www.estadietasifunciona.blogspot.com) y aunque ahora tengo poco contenido, me gustaría empezar a subir mis recetas de cocina sana. Había pensado mantener el menú que tengo ahora que en realidad no es mas que una linea HR, el enlace, otra linea HR otro enlace... pero cuando empiece a subir recetas me van a llegar los enlaces al fondo de la tierra.

Busco un menu, o el nombre con el que se conoce a este tipo de menu que cuando pulse un enlace, ejemplo: Recetas; se despliege un submenu debajo del enlace de Recetas y salgan los enlaces. Pongo una imagen para que quede claro.

A: es cuando esta sin desplegar
B: es cuando se hace clic la primera vez en "Recetas". Si hace clic una vez mas en "recetas" deberia cerrarse para quedar como en A y si se hace clic en otro enlace de primer nivel tambien cerrarse el que esté desplegado y abrir ese de primer nivel.

Creo que mas o menos se me entiende



Gracias de antemano.

[Mauricio Acosta Vene]

Hola!!!

Este tipo de menu se llama "acordeon". Busca en Google, encontraras bastante y con diversas tecnologias.

[Daniel Ulczyk]

Vertical acordion

En—puro—CSS3 tenés la opción de la gente de w3avenue entre otras.

[oNefl0w189]

Tienes mil opciones para hacer lo que quieres... Desde crear el menu con Divs ocultos que se muestren al hacer click, un simple bucle con PHP mostrandolo, jquery, puff.. mil maneras. aunque supongo que si lo quieres para un blog, una buena manera sería mediante Js y CSS.

Con llamarlo "Menu Desplegable" lo encontrarás, hay muchos echos.. alomejor te sirve alguno, Googlea!

[UsuarioArroba]

Gracias a ambos. Me ha gustado mucho el w3avenue porque he logrado ajustarlo al ancho de la capa izquierda del blog, pero se me presenta un inconveniente que me fastidia el plan. Cuando intento modificar el tamaño del espacio donde se presentan los link, resulta que para todas las capas tiene que ser el mismo y si pongo en

.verticalaccordion>ul>li:hover {
height: 280px;
}

el height a 820px por ejemplo, todas las capas del interior del menu se me establecen en ese tamaño y si la pongo en auto se descontrola todo absolutamente, al menos en Chrome. Seria perfecto si pudiera hacer que se amoldara al contenido, de modo que si tengo 4 enlaces con 280px tiene de sobra, pero si en un nivel tengo 10 se queda chico y no se muestran. Si le subo los px resulta que el de 4 queda mal porque le sobra muchisimo espacio en blanco.

Gracias a ambos por vuestras respuestas.

[UsuarioArroba]

Al final he encontrado este:

http://www.davidrojas.net/index.php/diseno-web/menu-vertical-en-acordeon-con-css-y-jquery/

Está perfecto para lo que quiero así que me decido por el. Saludos.

[UsuarioArroba]

Perdona oNefl0w189 pero no había visto tu mensaje hasta ahora que he vuelto a entrar. Gracias a tí tambien por la ayuda. En php podría haberlo hecho sin problemas, pero al estar alojado en blogger no se si me permitiría usar código php. Igualmente, como me ha gustado el que he puesto en el mensaje anterior, me voy a quedar con el. Saludos.