No video

Como CREAR un MENÚ DESPLEGABLE con HTML CSS y JS

  Рет қаралды 138,515

AlexCG Design

AlexCG Design

Күн бұрын

Aprende como crear un menú de navegación despegable animado, este menú será adaptable a dispositivos móviles, haremos este menú utilizando HTML CSS y Javascript.
📣 ¿Necesitas un Hosting y Dominio? Utiliza el cupón "ALEXCG" hasta para un 90% de descuento en Hostinger.com.
ENTRA AQUÍ 👉 www.hostinger....
-----------------------------------------------------------------------------------------------------------------------------
CURSOS COMPLETOS:
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.c...
👨‍💻🎁 Diseño Web Desde Cero (Descuento) 👉 alexcgdesign.c...
-----------------------------------------------------------------------------------------------------------------------------
Sigue aprendiendo CSS:
💥 Lista de reproducción CSS: • 💻 CURSO CSS GRID LAYOU...
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.c...
-----------------------------------------------------------------------------------------------------------------------------
Descarga el proyecto: alexcgdesign.c...
✉️ Redes sociales:
Blog de desarrollo web: www.alexcgdesi...
Facebook: goo.gl/7o77tx
Linkedin: goo.gl/byCJnS
Github: github.com/Ale...

Пікірлер: 142
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
@Camilo Alejandro Lesmes Leguizamo No aún no agrego un proyecto así, pero el curso se sigue actualizando mes con mes, así que no lo descarto:)
@josegilcesc
@josegilcesc Жыл бұрын
@@AlexCGDesign Hola! Y cómo puedo colocar mi contenido debajo del menú? mi contenido se haya en un js
@CAFernandezB
@CAFernandezB 3 жыл бұрын
Bro lo que más me gusta de tu canal es que no usas framework, solo código puro.. eres un máster.. éxitos..
@levialviter2302
@levialviter2302 2 жыл бұрын
x2
@hermano_Juan
@hermano_Juan 2 жыл бұрын
Si eso de estar bajando librerias cansa
@eiohan7777
@eiohan7777 5 ай бұрын
Lo que me gusta de este canal es que es programacion 100% sin framework! asi se aprende mas!
@FrankGP.com.
@FrankGP.com. 3 жыл бұрын
Gracias por no usar librerías, esto me ayuda a practicar
@pierojara6342
@pierojara6342 3 жыл бұрын
Que son librerías? Recién empiezo en esto, desconozco muchas cosas aún
@FrankGP.com.
@FrankGP.com. 3 жыл бұрын
@@pierojara6342 hola piero, libreria es un codigo guardado en la nube, y lo pueden usar varias veces, es util para acelerar el trabajo, pero... si usas las librerias de otros sin saber como funcionan es como copiar la tarea de otra persona, sin entender nada, eso perjudica mucho a largo plazo, muchas librerias seria como tener muchos libros en nuestro maletin sin entenderlos. y el maletin seria pesado, yo prefiero tomar notas y llevar solo mi cuaderno de NOTAS. PREFIERO USAR POCO CODIGO EN MI WEB, asi optimizo mi pagina
@FrankGP.com.
@FrankGP.com. 3 жыл бұрын
@@pierojara6342 es como usar un plugins en wordpress 😁
@FlipazoneFilms
@FlipazoneFilms Жыл бұрын
@@pierojara6342 usar algo que ya esta hecho y ponerlo en tu codigo, "reinventar la rueda"
@velvetJackie
@velvetJackie 2 жыл бұрын
Me sorprendí de que al final sí me saliera, gracias por explicar tan bien el por qué de cada código
@dianabarboza6161
@dianabarboza6161 2 жыл бұрын
Excelente post. Felicitaciones.. estoy cursando programación web y tus vídeos ayudan mucho.
@rosaanabella9559
@rosaanabella9559 3 жыл бұрын
Capo siempre suelen complicarse para hacer los menus, pero lo explicas muy facil, tengo un proyecto de la universidad y solo me faltaba el menu, nueva suscriptora
@blax_cielo
@blax_cielo Ай бұрын
Excelente video y un gran plus la posibilidad de descargar el proyecto, muchas gracias
@draiflowtv4112
@draiflowtv4112 Жыл бұрын
una consulta ya opteniendo el menu como hago para agregar contenido a cada una de las secciones y que se muestren cuando las seleccionas?
@albertosantiago6600
@albertosantiago6600 3 жыл бұрын
Sin duda css es mi talon de aquiles, ni javaScript se me complica tanto como css, comprare tu curso de css a ver que tal, ya que con otros cursos no he tenido el avance que quiero
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Pruebalo, son 21 horas de contenido:))) un saludo!
@carlosurtubia8265
@carlosurtubia8265 2 жыл бұрын
Que buena explicación, que genial sería un curso de Dom Javascript de este señor
@jsegomez
@jsegomez 2 жыл бұрын
Eres un crack… Siempre, busque la manera de hacer esto y lo que encontraba era muy horrible... Muchas gracias
@rallygou
@rallygou 3 жыл бұрын
Mil gracias, buscaba algo así para aprender un poco más de este mundo :D
@caminoalmillon007
@caminoalmillon007 5 ай бұрын
Excelente logica de programacion amigo, muchas gracias por este aporte, realmente muy bonita esta barra de navegación.
@LennyDeveloper
@LennyDeveloper Жыл бұрын
Me encanto sin duda con estos conocimientos mejore mi logica de programacion muchas gracias!
@jesuscarrasco9963
@jesuscarrasco9963 3 жыл бұрын
Gracias bro, en un futuro retomare tus cursos, son geniales :'D
@sabdielisstech5049
@sabdielisstech5049 3 жыл бұрын
Brutal, gracias!! Saludos desde Puerto Rico!
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Un saludo!
@shephardplayer693
@shephardplayer693 2 жыл бұрын
genio!!! me salio :'3 un poco frustrante cuando no sale pero cuando revisas el codigo y encuentras la solucion que alegria da :3
@Angel-wy4nw
@Angel-wy4nw 3 жыл бұрын
Demn que buen vídeo, gracias!! Darle a las librerías hace que pierdas algunos conceptos.
@josemanuelherrero6495
@josemanuelherrero6495 3 жыл бұрын
Genial razonamiento con la altura del menú!!! 😀 😀
@Brayan-ft6sk
@Brayan-ft6sk 3 ай бұрын
me sorprende lo bien que lo explicas, recientemente te estoy siguiendo !!, consulta como seria cuando utilizando un framework como react o asi?
@ERLSTUDIOS
@ERLSTUDIOS 3 жыл бұрын
JUSTO LO QUE ME FALTABA GRACIAS BRO ...👍
@alejandrodinardo4804
@alejandrodinardo4804 3 жыл бұрын
Muchas gracias, el menú es elegante y su funcionamiento está muy bien explicado. Me permito sugerirte que revises la pronunciación de "hidden" y "sibling". Cordiales saludos.
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Muchas gracias por el consejo Alejandro, un saludo! Claro que lo haré
@Darkzik_011
@Darkzik_011 3 жыл бұрын
Excelente video broooo me encanta tu contenido ❤️😎🤝
@enriquefernandez5476
@enriquefernandez5476 3 жыл бұрын
Eres un crack, bro. Saludos y esperamos el siguiente video. 🤘
@AlexSearchYT
@AlexSearchYT 2 жыл бұрын
Buen vídeo amigo, piensa en hacer las prácticas de tus vídeos en modo oscuro para no quemar tanto la vista! Un saludo.
@eigorcamargo7324
@eigorcamargo7324 3 жыл бұрын
excelente hermanito gracias muy buen video para repesar algo css gracias
@carlavallejos3470
@carlavallejos3470 Жыл бұрын
Excelente video! Mil gracias!!!
@ubaldosanjuansanjuan2393
@ubaldosanjuansanjuan2393 3 жыл бұрын
Muchas gracias por compartir conocimiento bro 😊
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
A ti por verlo Ubaldo, un saludo!
@marceloguzman646
@marceloguzman646 3 жыл бұрын
buen video, me encanta cómo se anima la altura tan fácilmente
@chxllmoon3909
@chxllmoon3909 3 жыл бұрын
Gracias cruk ya me veo como desarrollador web
@zcoding8355
@zcoding8355 3 жыл бұрын
Excelente vídeo... Gracias! Tendrás algún vídeo-tutorial sobre como hacer un menu, tal vez como el que acabas de desarrollar, pero que también sea responsive?
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Claro, en este vídeo kzfaq.info/get/bejne/n9ypfNSeyODceIk.html
@pikalink818
@pikalink818 2 жыл бұрын
muchas muchas gracias, super chido el tutorial y me sirvio 100%
@elricho72
@elricho72 Жыл бұрын
Quedo buenisimo, se podria agregar para que el menu aparezca con un 3 lineas tipico y que ahi se muestre todo ? Asi no ocupa tanto lugar siempre desplegado.
@jaimefer2949
@jaimefer2949 3 жыл бұрын
Amigó gracias muy buen proyecto.
@jonathanvarongomez8475
@jonathanvarongomez8475 3 жыл бұрын
Agradezco tus vídeos. Me gustaría aprender de javascript, por si tienes videos. Saludos
@T.A.G.G
@T.A.G.G 2 жыл бұрын
Excelente tutorial y el menú está rre fachero, en que parte del body tengo que pegarlo para integrarlo en mi página y que quede arriba del bacground sin que aparesca arriba en el head o abajo al final de la página? Desde ya muchas gracias.
@andresmauricioredonocampo
@andresmauricioredonocampo Жыл бұрын
Muchas gracias amigo, excelente menu
@NoSeTio
@NoSeTio 4 ай бұрын
Sabes como poner un botón o algo para que cuando se pulse se oculte esa cosa que has hecho?
@JuniorOnLive
@JuniorOnLive 3 жыл бұрын
oye Bro, me urge ver este video, en un ratito cuando llegue a casa lo veo, porque ahorita estoy en el trabajo!!. Saludos
@williamleon3491
@williamleon3491 Жыл бұрын
Gracias por el tutorial, fué de mucha ayuda. Por cierto hidden y sibling se pronuncial tal cual se escriben. Decir haiden y Saibling está mál pronunciado :v
@andrewca1050
@andrewca1050 3 жыл бұрын
Excelente video. Graciaas. De casualidad sabes de como poner el menu en todas las pestañas de tu pagina? Me refiero a no estar copiando y pegando el menu en cada pagina C:
@usuario_g00gl3
@usuario_g00gl3 2 жыл бұрын
Hasta donde yo se, se debe hacer página por página, no existe otra forma.
@geovannygonzalez8379
@geovannygonzalez8379 2 жыл бұрын
Alex, estoy buscando la forma de cuando tenga un submenu abierto y toque otro elemento con submenu, pues se pueda cerrar el que se encuentra desplegado que solo haya un submenu desplegado ya me entiendes doy click se abre el abre el actual y se cierra el otro por si se encuentra desplegado
@pabloramironieva3524
@pabloramironieva3524 3 жыл бұрын
Hermoso amigo. Gracias
@moisesalejandromontielbric7720
@moisesalejandromontielbric7720 3 жыл бұрын
Wenas noches a los que ven los videitos de Alex
@rodolfolopezp
@rodolfolopezp 3 жыл бұрын
Excelente. Para cuando un responsivo para el?. Nos serviria de mucho. Te felicito!!
@anthonysistems
@anthonysistems 3 жыл бұрын
GENIAL ALEX GRACIAS POR EL VIDEO
@angelfigueroa6662
@angelfigueroa6662 3 жыл бұрын
Puedes enseñarnos a hacer un Nav con submenus? Solo encuentro videos que lo hacen con listas y float y no me gusta para nada. Ojalá nos enseñaras a hacerlo de forma moderna
@LuisLopez1099llg
@LuisLopez1099llg 3 жыл бұрын
increíble!!!!!1 :0 muchas gracias.
@gerardmartiteruel110
@gerardmartiteruel110 10 ай бұрын
Buenas tardes, quiero reabrir este vídeo porque me a servido de mucha ayuda para mi comienzo en programación. Pero tengo un problema, una vez tengo centrado todo como tu, en el submenú, en tu caso porque tienes "Estoy dentro" y tiene la misma cantidad de letras, pero yo que tengo diferentes se me ve centrado pero no centrado hacia la izq. pero debajo de su padre. Y luego me gustaría también delante de estas poner otros iconos para cada enlace del submenú, y que queden alineados y centrados. Gracias
@elchochaso
@elchochaso 3 жыл бұрын
pregunta como accedo al contenido de los item de ese men
@cristianhormazabal7710
@cristianhormazabal7710 3 жыл бұрын
Amigo disculpa la pregunta,pero hay que saber programar todo de memoria? Osea entiendo los codigos pero no puedo o me cuesta mucho hacerlo sin ver codigo ajeno,entonces mi duda es hay que saberse todos estos comandos de memoria? Ya que en todo tutorial siempre veo que el que enseña no mira recurso externo
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Hola Cristian, ¿Cómo estás? A veces detrás de cámaras solemos ver código y otras veces sabemos que hacer porque lo hicimos previamente, no hay que saber todo de memoria, aunque con el tiempo de practica aprendes mucha sintaxis de memoria, es cuestión de constancia y paciencia:)
@cristianhormazabal7710
@cristianhormazabal7710 3 жыл бұрын
@@AlexCGDesign muchas gracias
@lelloroaitadori7546
@lelloroaitadori7546 2 жыл бұрын
Genial, amo aquí
@jesusgil583
@jesusgil583 3 жыл бұрын
no sabias que tenias canal de face, estoy aprendiendo contigo. sados y exitos
@leonbgerman
@leonbgerman 2 жыл бұрын
Hola. Una vez hecho el menú con los 3 archivos htlm, css y js, cuál es el paso a seguir para incorporarlo a un sitio con wordpress que tiene un theme especifico?. Gracias.
@crdesign__6568
@crdesign__6568 3 жыл бұрын
Que maravilla!
@hecmen84
@hecmen84 3 жыл бұрын
Muy buen video 👏👏
@Andy_rivera
@Andy_rivera 3 жыл бұрын
muy buenos videos bro, ya te sigo hace algún tiempo. tengo una duda, sería menú despegable o desplegable? saludos.
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Hola Andy, sí error mío jajaja es desplegable, una disculpa.
@Andy_rivera
@Andy_rivera 3 жыл бұрын
@@AlexCGDesign jaja vale tranquilo bro, saludos.
@fabpare
@fabpare 2 жыл бұрын
Muy bueno!!
@juliandavidalvaradogantiva6461
@juliandavidalvaradogantiva6461 Жыл бұрын
TE AMO
@juangabrielmollo4365
@juangabrielmollo4365 7 ай бұрын
Hey bro! que buen contenido, me gustaria saber como hacer para que al seleccionar un 2do menu, el primero colapse automaticamente. Saludos desde ARG
@Jdecode
@Jdecode 3 жыл бұрын
pudiera que eso se puede hacer con css, solo que no hay algo que no permite calcular dinámicamente el ancho de la capa para que aplique la animación suave si lograras sintetizador en css seria genial
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Exacto, pero si estaré buscando maneras de hacerlo dinamicamente:))
@Carli180
@Carli180 2 жыл бұрын
Como hacés la rutina en javascript si tenés a parte un submenú de un submenú? Gracias.
@jamesenrique648
@jamesenrique648 3 жыл бұрын
Chingon!
@josuejaminguzman5501
@josuejaminguzman5501 3 жыл бұрын
Deberias hacer un video de como hacer un sistema de pedidos, estaria bueno !!!!😀😀😀
@eduardopicen9850
@eduardopicen9850 2 жыл бұрын
Hola, tengo una duda por que al momento de hacer lo de js no me hace lo de las alertas dentro de los botones ?
@adrianugas9075
@adrianugas9075 3 жыл бұрын
Excelentes tutoriales Alex, una consulta adicional a ver si me ayudas con esto: como podría hacer para que al desplegar este menú, se cierre automáticamente otro previamente desplegado, de manera que solo pueda verse desplegado uno a la vez. gracias de antemano.
@Carli180
@Carli180 2 жыл бұрын
Ni te respondió. Yo estoy buscando lo mismo. Tengo un menú con submenú y a la vez un submenú de submenú. Tenés alguna idea de como hacer la rutina en java?
@novichpenderegast3525
@novichpenderegast3525 Жыл бұрын
Hola q tal yo quiero meter un form dentro de un estilo acordeon se podr?
@HorusSpl
@HorusSpl Жыл бұрын
Buenas, y como le hago para poner cosas a la derecha, lo que agrego me sale abajo del menu.
@amadisfiguera3356
@amadisfiguera3356 6 ай бұрын
Excelente Curso, Links de los materiales caído amigo
@muratleon7653
@muratleon7653 Жыл бұрын
Hola puede enseñar con nav con sumeno tenga mas elemnetos como los meses y pueda verse todos los meses al desplegarse
@jonaf6204
@jonaf6204 3 жыл бұрын
Messirve 😎🤏 que buen video
@lopezvargasfernando2277
@lopezvargasfernando2277 Жыл бұрын
puedes hacer otro pero usando react seria espectacular
@Joel-kr6ex
@Joel-kr6ex 8 ай бұрын
como puedo hacer para que el menu desplegable al seleccionar una opcion te redirija a la seccion especificada del html y se cierre el menu desplegable? yo tengo un menu hamburguesa para movil.
@eliasgarcia3462
@eliasgarcia3462 2 жыл бұрын
Muy bueno el video y la explicacion, pero ahi un error que estoy intentando decifrar para poder corregirlo, y es que el menu no funciona con tabIndex, al pasar el tabulador por el menu, hace cosas raras y se desaparece, cosa que en experiencia de usuario es un poco molesto. Pero muy bueno tu video 👍👍
@srstark9012
@srstark9012 2 жыл бұрын
Buen video loca,cuidese
@reflejoespejo5619
@reflejoespejo5619 3 жыл бұрын
Te ganaste un sub hermano
@andreskmilo182
@andreskmilo182 Жыл бұрын
hola quetal Como se hace para que la ventana aparesca al lado del menu??
@cajadeemociones6880
@cajadeemociones6880 Жыл бұрын
Tengo una pregunta en el minuto 11:30 estas enviando los botones a la izquierda pero el codigo de la linea 40 a la 44 no se hubiera simplificado si solo le dieras un text-alaing: start; de todas manera hare las prueba porque descargue el codigo.
@paramisapp688
@paramisapp688 6 ай бұрын
Puedes pasarme el código por favor 🙏🏻
@caduranster
@caduranster 3 жыл бұрын
Gracias, crack.
@linuxyelarte1641
@linuxyelarte1641 3 жыл бұрын
Gracias por el tutorial, pero porfa podrías hacer un formulario en la cual capture el nombre, su correo, asunto y su mensaje de la persona que está escribiendo, y cuando haga click en enviar todo esos datos los envíe a un correo destino por ejemplo que todos estos datos se vallan a un correo de Gmail , pero todo esto están en u servidor ya publicado con un subdominio y que está corriendo en docker usando Nginx como proxy reverso
@javagenius144
@javagenius144 3 жыл бұрын
PUCHA!!!!!!!!!!!, y yo diciendo "Desplegable" toda mi vida :'( , Gracias por tus tutoriales ;)
@joancodedev
@joancodedev 3 жыл бұрын
"DESPLEGABLE" Así mismo se escribe y se dice !
@javagenius144
@javagenius144 3 жыл бұрын
@@joancodedev A éso me refría jjejejeje
@nicolassso
@nicolassso 3 жыл бұрын
muy bueno
@davidghaalamzaratealtamira2518
@davidghaalamzaratealtamira2518 Жыл бұрын
Excelente video, me gustaria saber si alguien puede ayudarme, como enlazar ese menu a paginas para que se abran a al derecha del menu sin que desaparezca... si alguien sabe porfavor que me ayude... saludos y buenas noches!
@MichelleNe
@MichelleNe 2 жыл бұрын
Seguí paso por paso todo y no me salio nada :'(
@brayandejesuscastilloflore5445
@brayandejesuscastilloflore5445 Жыл бұрын
pana sigo el tutorial al pie de la letra incluso cuando reviso el heigth que se nesecita por consola me funciona me en el condicional para agregar ya la animacion no funciona repito buso el error pero no lo enecuentro me puedes ayudar compartiendome el codigo
@samuelp2381
@samuelp2381 3 жыл бұрын
Hola puedes subir un vídeo de Hacking ético porfa
@victorgiovannibeltranrodri1047
@victorgiovannibeltranrodri1047 Жыл бұрын
Se podría eliminar el js con el clásico truquito de usar un label y un input checkbox display hidden
@pabloortega6750
@pabloortega6750 2 жыл бұрын
no encuentro los asset
@calceta888
@calceta888 2 жыл бұрын
Lo observe detenidamente
@federicoaldana5952
@federicoaldana5952 3 жыл бұрын
EL comportamiento de los elementos dentro de un contenedor/caja de me dificulta mucho.... :( Posicionarlos y demás... Algún consejo maestro?:(
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Siii, te recomiendo este video:) kzfaq.info/get/bejne/Y6mhg7Bi3Ze4Yo0.html
@Cristian-ds9js
@Cristian-ds9js Жыл бұрын
bro no me sale, no se que error tengo
@Val-ye6nv
@Val-ye6nv 2 жыл бұрын
GENIO
@usuario_g00gl3
@usuario_g00gl3 2 жыл бұрын
Puedes hacerlo responsive?
@fernandopoveda9861
@fernandopoveda9861 3 жыл бұрын
Creo que se podía crear sin incluir javascript no, únicamente CSS Puro!?
@AlexCGDesign
@AlexCGDesign 3 жыл бұрын
Si claro, se podría:))
@raidcito
@raidcito 3 жыл бұрын
buen tuto
@josedanielrodriguezbedoya6131
@josedanielrodriguezbedoya6131 2 жыл бұрын
7:37
@senderotecnologico5052
@senderotecnologico5052 3 жыл бұрын
Por donde te podria contactar
@thens1905
@thens1905 3 жыл бұрын
es responsive?
@jorgeeduardoaristizabalvil1334
@jorgeeduardoaristizabalvil1334 10 ай бұрын
no estan los archivos
MENÚ HAMBURGUESA DESPLEGABLE súper fácil con HTML, CSS, y JS!
15:58
English or Spanish 🤣
00:16
GL Show
Рет қаралды 7 МЛН
Bony Just Wants To Take A Shower #animation
00:10
GREEN MAX
Рет қаралды 7 МЛН
🩷🩵VS👿
00:38
ISSEI / いっせい
Рет қаралды 27 МЛН
SPILLED CHOCKY MILK PRANK ON BROTHER 😂 #shorts
00:12
Savage Vlogs
Рет қаралды 50 МЛН
Sitios Web Asombrosos
23:02
Fazt
Рет қаралды 676 М.
Como hacer un Menú Desplegable facil y sencillo con HTML y CSS
20:14
✅COMO HACER MENÚ DESPLEGABLE CON PURO HTML Y CSS
1:03:14
VisualAvalon
Рет қаралды 118 М.
Como CREAR MENÚ LATERAL DESPLEGABLE con HTML - CSS - JS || 2021
1:01:41
CREA un MENÚ ANIMADO con CSS RESPONSIVE [ ❌ Sin JavaScript ]
21:37
Como Hacer un Menù Lateral con Html y Css
15:18
SLee Dw
Рет қаралды 124 М.
Menú Desplegable  - HTML & CSS
6:14
Código Web
Рет қаралды 104 М.
Menu horizontal responsive con HTML y CSS
20:17
J&G Proyectos Web
Рет қаралды 460 М.
English or Spanish 🤣
00:16
GL Show
Рет қаралды 7 МЛН