YAMM3 - Build Megamenu para Bootstrap 3

Hay muchas ventajas de usabilidad en el uso de megamenú en una página web. Con megamenú, puedes tomar el control total de tu menú . Casi todos los elementos web se pueden asignar allí. Algunas grandes empresas incluso han aplicado megamenú en su sitio web. Amazon y Mashable por ejemplo. Amazon tiene un fondo de imagen en su menú y Mashable usa imágenes en miniatura para un menú más atractivo.

Si ha estado trabajando con Bootstrap, ahora puede construir un megamenú en un abrir y cerrar de ojos con esta nueva biblioteca llamada Yamm de Geedmo.

Yamm3 ( Yet Another Megamenu ) es una biblioteca CSS que te ayuda a construir un megamenú en Bootstrap 3 fácilmente. El megamenú funciona para diseños sensibles y fijos . Cubre casi todos los elementos de arranque que se incluirán en la barra de navegación como la imagen, el acordeón, la lista, la cuadrícula, la tabla, la forma, etc.

Guía Básica

Yamm3 usa CSS liviano y puro. Para comenzar con Yamm3, solo tiene que incluir la clase Yamm3 que necesita en el marcado HTML de la barra de navegación estándar.

Antes de trabajar con Yamm3, el primer paso es incluir la biblioteca de hojas de estilos Yamm3 y Bootstrap en la sección principal de la siguiente manera:

 ...  ... 

Y no se olvide de incluir también la biblioteca jQuery y Bootstrap en su proyecto, ya sea en la sección de cabeza o cuerpo, de esta forma:

 ... ... 

Tenga en cuenta que usamos Bootstrap 3 aquí y la versión mínima de jQuery requerida es la versión 1.9.0+ . Si todavía está ejecutando la versión anterior de Bootstrap, le recomendamos seguir la guía de la versión anterior de Yamm.

Marcado HTML

En el uso básico, para usar Yamm3 primero agregue la clase .yamm en la parte superior de la marca de la barra de navegación. Luego, puede agregar su .dropdown-menu clase .dropdown-menu . El siguiente es un ejemplo básico.

Como se ve allí, también puede usar .yamm-content como una opción para ajustar el contenido con el relleno.

Por ejemplo, intentemos agregar un menú de acordeón dentro de nuestra barra de navegación de marcado. Reemplace el comentario de Your Menu Goes Here con el siguiente código.

Artículo # 1 del Grupo de Acordeón 
 Este es un menú colapsable. 
Artículo # 2 del Grupo de Acordeón 
 Este es un menú colapsable. 

Al invocar la ID de accordion y usar una clase de panel-group para agrupar, puede crear un acordeón dentro de la barra de navegación. Y entonces nuestro menú se verá como la captura de pantalla a continuación:

Hay muchos otros componentes que puede agregar a la barra de navegación. Puede realizar la autoexploración de otros componentes que puede implementar si descarga el archivo completo Yamm3 y abre el archivo index.html con su editor de código favorito.

Javascript

Hay un código de JavaScript adicional utilizado para la prevención de un menú cerrado inesperado en algunos componentes como acordeón, formularios, etc. Solo incluya el siguiente código en su cabeza o sección del cuerpo:

Conclusión

Yamm3 es otro gran producto de terceros para impulsar el desarrollo de su Twitter Bootstrap al construir una barra de navegación atractiva. Solo necesita un pequeño esfuerzo para explorar todos los componentes de implementación, ya que carece de soporte de documentación para crear el menú de varios componentes .

Comparta su opinión con nosotros en la sección de comentarios a continuación.

Escribir contenido que convierta lectores y entregue ventas

La Optimización de la tasa de conversión es una de las formas más complejas de escritura en el comercio electrónico. Es por eso que muy pocos escritores afirman ser capaces de hacerlo. El hecho es que tienen miedo de reclamarlo. CRO no se trata solo de escribir La psicología de las ventas en realidad asusta a la mayoría de los escritores porque hay tantos elementos involucrados, de los cuales la escritura es solo una pequeña parte .De tod

(Consejos de tecnología y diseño)

6 funciones independientes (pero aburridas) Freelancers Odio hacer

Lo que ocurre con el trabajo independiente es que es un negocio. Puede ser un diseñador gráfico, escritor o desarrollador web de profesión, pero ya que está haciendo negocios, siempre hay algunas tareas aburridas pero esenciales, como organizar listas abrumadoras de tareas o presentar impuestos desagradables. No

(Consejos de tecnología y diseño)