En el área informática, un menú contiene una serie de opciones que el usuario puede elegir para realizar determinadas tareas; estos están contenidos en una barra de menú, la cual se puede decir que es una propiedad que tienen las ventanas para poseer menús, dado que la barra en sí misma no es una ventana, como lo puede ser un botón de comando o un cuadro de texto, pero tampoco es una barra de herramientas, sino un objeto contenedor de otros menús.

Estos se organizan siguiendo el principio de los árboles, esto quiere decir que un menú puede tener menús hijos y menús padres; al inicio, cuando se crea una barra de menú, el identificador del objeto nuevo es un identificador de menús válido, además de que la barra de menú queda como la raíz, el nodo principal, o en otras palabras, un menú sin padres.

De ahí se empieza a crear menús hijos como lo puede ser uno que se llame Archivo, otro Edición y otro Ver, que tendrán como padre al manipulador (handler) del menú raíz; estos menús, a su vez, pueden tener menús hijos, así, archivo, descendiendo de MenuBar puede engendrar Abrir, Guardar, Guardar como, Codificación, entre otros; y siguiendo estas mismas reglas, Codificación, descendiente de Archivo puede engendrar un submenú con los comandos ASCII, Unicode, UTF-8, entre otros.

 

Tipos de menú

Entre los menús más usuales, destacan:

-Normales: Los que tienen el predominio más alto en las aplicaciones.

-Casillas de verificación: Activan un indicador y su estado cambia a «marcado/desmarcado».

-Botones de radio o Radio buttons: Es  un grupos de botones en donde sólo se puede tener activo uno de ellos y su indicador acostumbra a ser una viñeta.

-Submenús: Son aquellos menús que tienen menús hijos, es decir que no se puede hacer clic en él, en vez de eso hay que seleccionar uno de sus hijos; usualmente traen consigo una flecha en la lateral derecha indicando la naturaleza del mismo.

-Separadores: Son los menús sin nombre ni valor, pero con handler, se muestran como líneas grises opacas entre la lista de comandos.

HTML, CSS Y JQUERY para hacerlo

Hay ocasiones en que se necesita que el menú de un sitio web permanezca en la parte superior del navegador cuando se hace scroll hacia abajo. Para lograr esto, se puede crear un menú y mediante jQuery lograr que al ocultarse de la vista, se coloque en la parte superior de la pantalla, por encima de cualquier elemento.

La librería jQuery entre tantas de sus funciones, cuenta con un calculador de la posición absoluta de un elemento, aún si este no tuviera el estilo position en absolute; para obtenerla, se utiliza la función offset, y se lo compara con scrollTop, se puede saber si parte del menú ha salido de la vista del usuario. El código se debe poner en el elemento script antes mencionado.

En cuanto a CSS, los estilos menú-contenedor y menú deben ser del mismo alto, así cuando se “independice” menú de su menú padre, no quedará un vacío, de ser así se correría todo hacia arriba causando otro desplazamiento, devolviendo el objeto a su estado estático, también llamado llamado “ciclado”.

Pasos para crear un menú fijo

Los menús fijos son una tendencia en el diseño web hoy en día, porque lucen bien, y son muy útiles para los visitantes. De esta manera se puede crear un ligero, funcional y práctico menú fijo para un sitio web:

1. Para comenzar, se debe hacer la estructura básica del header y del menú; asimismo, es importante recordar que tendrá algo arriba de él, usualmente un logotipo.

2. En el header, se coloca un contenedor para el logotipo y el menú con una clase llamada .contenedor, esta clase se usa para centrar los elementos del menú.

3. Es importante que se tenga contenido para que aparezca un scroll y se pueda bajar en la página para ver el menú en acción. Para CSS no se hace nada especial; un simple y ordinario menú. En Jquery es sencillo, es preciso conocer la distancia entre el menú y la parte más alta de la página, así que se guarda en una variable llamada altura este dato, y luego se extrae con el objeto offset.