Rellenando campos de un formulario la aplicación genera el código fuente para un menú desplegable horizontal con varios sub-niveles.

• Permite distintos targets para cada link.
• Se puede escoger si se quiere que los sub-menús se desplieguen hacia la derecha o hacia la izquierda.
• Se puede escoger la anchura de los sub-menús a partir de la segunda generación
• Se puede escoger la anchura de los botones principales

Número de menús: cantidad de botones del menú principal
Anchura del botón: Valor en pixels para los botones principales

Una vez configurados esos datos pinchar en el botón agregar.
Para borrarlo todo pinchar en el botón quitar

Configuración de opciones de los sub-menús:

Texto para menú: El texto descriptivo que se quiera que muestre cada botón

num. subopciones: Crea un sub-menú con tantos botones como se especifique en este campo.
- Tras inserta la cantidad hay que pinchar en el botón crear.
- Una vez creadas las opciones el botón crear cambia por modificar cantidad.
- En el caso de haber puesto mal la cantidad este botón permite re-crear la cantidad de opciones insertándolos de nuevo.
- El momento de modificar la cantidad es mejor antes de rellenar esos campos con datos. Si se pincha en modificar cantidad y yá se hubieran rellenado los campos estos datos se perderían.
- En el momento en el que creemos más sub-opciones no podremos cambiar la cantidad (el botón cambia a ok)

NOTA: El link sólo funcionará si ese botón no tiene un submenú asociado. Los botones que despliegan sub-opciones no llevan link (aunque se les ponga). En el momento en el que a un botón se le crean sub-opciones el campo Link queda deshabilitado.

Target: ventana en la cual queremos que se cargue el link asociado al botón. Si se omite el link cargará en la propia ventana. Si se quiere abrir en una ventana nueva hay que poner Nueva.

Ancho submenu: Anchura que queremos para el sub-menú que despliegue ese botón. Es aplicable a partir del segundo nivel de despliegue. En el primer nivel la opción aparece desabilitada.

dirección: Dirección hacia la cual queramos que se despliegue el sub-menú (derecha o izquierda). Por defecto se abrirá hacia la derecha. Es aplicable a partir del segundo nivel de despliegue. En el primer nivel la opción sale deshabilitada.

Para generar el código hay que pinchar en el botón generar menú. Se puede ir pinchando en este botón para ir visualizando cómo queda lo que estamos configurando. El menú con su código se abrirá en una ventana nueva, con lo que no se pierden los datos introducidos hasta el momento.

Una vez tengamos el menú listo hay que copiar el código javascript generado y pegarlo en la página en donde vaya a visualizarse el menú principal. Luego hay que crear en el cuerpo del documento el contenedor en donde queramos que se inserte el menú para poder ubicarlo en la posición exacta del documento en donde queramos. Puede ser un párrafo <p> un div <div> o una celda <td> y asignarle un id tunMenu; ej: <td id="tuMenu"> o <div id="tunMenu">

Además hay que insertar la hoja de estilos en el documento. Para tratar los colores y fuentes hay que hacerlo de la forma habitual en la que se trabajan los estilos css. Hay que modificar las clases .botones y .botonesHover.

cerrar ventana