es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


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.

Este es un menú colapsable.
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.

11 Herramientas de administración de dependencias para desarrolladores web

11 Herramientas de administración de dependencias para desarrolladores web

Las dependencias son una piedra angular del desarrollo web moderno. Estas son las herramientas necesarias, complementos, bibliotecas y marcos necesarios para crear aplicaciones web de alto nivel .El gran número de dependencias se ha disparado en los últimos años. Con el tiempo, los desarrolladores han adoptado herramientas de administración de dependencias que alivian el estrés de mantener las dependencias organizadas y actualizadas . Est

(Consejos de tecnología y diseño)

Lo mejor de Hand Painting Art [PICS]

Lo mejor de Hand Painting Art [PICS]

La mano humana es una obra de esplendor. También es una herramienta que puede crear otro trabajo maravilloso también. Tomemos por ejemplo el arte de la pintura a mano. Usando las manos como parte de la obra final en sí misma, la pintura a mano da vida a una obra de arte mediante el movimiento, la superficie de la piel o las líneas de la palma.En

(Consejos de tecnología y diseño)