Crear menu responsive con subsecciones

[davidj]

Hola a todos,

Estoy buscando la manera de realizar de forma sencilla un menú horizontal, con subsecciones desplegables (hasta tres niveles) y que sea responsive.

En internet hay muchos pero o tienen fallos o no son responsive o solo son de dos niveles... Al menos yo no encuentro el código necesario.

ejemplo:

-sección
--- subsección 1
----- subsección 1.1
--- subsección 2
----- subsección 2.1
----- subsección 2.2

¿Podéis recomendarme algún código en especial?

Gracias,

[Rafael]

No hagas por favor 3 subniveles. La razón por la que no los hay es porque es mala idea. Es un laberinto flotante.

En dado caso tal vez alguno tipo acordeon donde haya que dejar activada la sección haciendo click.

Puedes preparar uno usando checkboxes https://www.google.com.mx/search?q=checkbox+menu+css

[davidj]

umm.. no es tan raro una web con secciones y dentro hasta dos subsecciones no??

[g3kdigital]

No es una buena práctica, hay muchos sitios que lo usan, pero no por ello significa que este bien usarlo, muchas veces es mencionado en sitios de usabilidad y ux, como una mala practica, a menos que tengas en tu web, más de un millar de artículos o una información super detallada donde importa mucho el nivel de conversión, es decir e-commerce, en otros sitios, basta con organizar la información en macrocategorias y subcategorias.

Esto no quiere decir que sea así por siempre, las nuevas tendencias y auge de tecnologías, podrian en un futuro hacer viable ese patrón de diseño incluso en móviles, pero por ahora no existe una solución facil o correctamente implementada, por eso es que encuentras fallos de responsive o de scripts.

De hecho, muchos designer dicen que si apenas tienes un volumen de menos de 100 enlaces en un sitio, una solución definitivamente mala es usar un menú de más de 2 niveles y recomiendan una mejor estructuración de información o una solución del tipo megamenú.

Sí aún así estas convencido, que es lo que quieres hacer, plantea una imagen del diseño y yo mismo te ayudo con los estilos, pero que al final vaya a ser plenamente funcional o una solución efectiva a tu proyecto, no lo puedo garantizar.

[Rafael]

Cuando estás en una computadora con un mouse ya de por sí es complicado seguir el caminito sin salirse. Si te sales del caminito tienes que empezar otra vez.

En una tablet ya es una pesadilla deslizar el dedo, ya que en una tablet dependiendo de la velocidad, del tiempo puede comenzar a tratar de "mover" el elemento en lugar de seguir el caminito.

Cada nivel implica hacer una pausa para "leer" el siguiente grupo de opciones.

Esas opciones ya no las puedes ni leer ya que hay un enorme dedo evitando que se colapse el menú.

No, no funciona.

Hacer click direct en un menú está bien, hacer un drop down, ok todavía funciona. Ya navegar un segundo nivel ya implica tener ese problema. ¿3 niveles? para nada.

Para muchas categorías busca un menú de acordeón, donde piques y se extiendan opciones. Ya puedes hacer entonces scroll en esas opciones. Pero también limítalo en la cantidad de subniveles.