MENÚ HAMBURGUESA DESPLEGABLE súper fácil con HTML, CSS, y JS!

Поділитися
Вставка
  • Опубліковано 3 гру 2024

КОМЕНТАРІ • 165

  • @alejandrotapiaflores9969
    @alejandrotapiaflores9969 Рік тому +29

    Tantos videos que existen en la web, y eres de los pocos que lo hacen muy bien explicados, concretos y directos. Excelente video¡

  • @sancochooe840
    @sancochooe840 Рік тому +11

    Estoy aprendiendo y busqué muchísimos tutoriales para mi proyecto pero este fue el único que entendí, explica muy bien. Nuevo sub!

  • @Guitarra-Sur
    @Guitarra-Sur Рік тому +15

    Me gusta tu dinámica, vas haciendo y explicando que hace cada cosa. Gracias!

    • @carpicoder
      @carpicoder  Рік тому +1

      Gracias Gabriel por el comentario! 🙌

  • @eross_sw
    @eross_sw Рік тому +1

    AMIGO probe cantidad de formas, nisiquiera bootstrap me convencia y venis vos y me solucionAS las VIDAAA MIL GRACIASSS

  • @elmazi22
    @elmazi22 Рік тому +2

    Realmente excelente. He estado buscando un tutorial para hacer un menú hamburguesa para mi primer proyecto, y la mayoría te complican. Este está super sencillo e interesante. El resultado final es muy bueno. Muchas gracias por compartir

  • @elia5gordillo827
    @elia5gordillo827 Місяць тому

    Aprendí más con este video de 15 minutos que de todo lo que me "enseñaron" en clase desde principio de año

  • @wolfywhite106
    @wolfywhite106 Рік тому

    Este vídeo me ayudó mucho en el proyecto final que me pidió mi profesor de programación... gracias!!!!

  • @migueqm
    @migueqm Рік тому +2

    Termino de ver el video, esperemos que ahora lo pueda implementar en mi proyecto. Saludos desde Colombia, ahí voy comentando como va yendo.

  • @JdorNumero12
    @JdorNumero12 9 місяців тому

    Me encanta como explicas amigo, simple, rápido, dinámico.

  • @carlosmontanez4339
    @carlosmontanez4339 9 місяців тому

    sos un genio, muy claro en tu explicación, en alguna parte ibas muy rapido, pero te entendí claro, asi que seguire aprendiendo contigo.

  • @joaquin_carp
    @joaquin_carp Рік тому

    Carpi con la facilidad y sencilles que explicas.. La tenes re clara. Gracias por el video. Saludos loco

  • @margarethramos8984
    @margarethramos8984 9 місяців тому

    Soy nueva suscriptora gracias por tu ayuda estoy estudiamdo diseño y desarrollo web y software y creeme que me sirvió de mucho tu video ahora lo pondre en practica!! 🎉 segui haciendo esto porfavor!!!exitos y saludos desde Honduras!!

  • @alldigitall
    @alldigitall Рік тому

    Excelente tu explicación !!!
    Min 6:32
    Si no quiero poner un botón para cerrar la nav-bar sinó que se cierre automáticamente cuando pinche un enlace en el menú nab-bar... ¿cómo se hace?
    Gracias.

  • @ivanjaviergonzalez7835
    @ivanjaviergonzalez7835 9 місяців тому

    sos un genio, gracias por tus videos y aportacion a la comunidad, Nuevo Sub merecido !!

  • @jonatanbustillo8482
    @jonatanbustillo8482 4 місяці тому

    Que alegría que no se pierde el tiempo viendo sus videos

  • @gustavoalejandrocanulmena3301

    He estado aprendiendo por mi cuenta todo este mundo del frontend, y me ha ayudado algunos de tus proyectos :), ahora solo aprender js para seguir caminando.

  • @EliasPalacio-uw9tw
    @EliasPalacio-uw9tw 18 днів тому

    wtf super bien explicado y en un periodo de tiempo muy corto, canal totalmente infravalorado, dejo mi like

    • @carpicoder
      @carpicoder  12 днів тому

      @@EliasPalacio-uw9tw 🥰🤙🏼

  • @gabrieltoledo9489
    @gabrieltoledo9489 Рік тому +1

    Noo!! Que genio Carpi. Justo lo que te estaba necesitando. Muchas gracias.

  • @booblock
    @booblock Рік тому +1

    Que sencillo lo haces carpi!! jajajaaj a mi me cuesta horrores, peo me ayudas muchisimo. Sos groso!

  • @lunaip4529
    @lunaip4529 Рік тому +2

    Me encantó Carpi!! Muchas gracias ♥

  • @mrsully2165
    @mrsully2165 Рік тому +2

    Absolutamente perfecto :) He empezado hace una semana a aprender HTML5, CSS3 y Javascript y es un mundo totalmente nuevo para mi. Gracias por aportar toda esta información tan valiosa y dejar que quienes llegamos nuevos aprendamos un poco de todo lo que ya sabéis :) Nuevo subscriptor 100% ganado, me voy a ver todos tus videos que como estén tan bien explicados como este van a ser geniales.

    • @carpicoder
      @carpicoder  Рік тому

      Muchas gracias por tan lindo mensajito y por tu apoyo! 🫶🏼💪🏼

  • @pedrosuardi
    @pedrosuardi Рік тому +1

    muchas gracias bro me sirvio muchisimo para aprender

  • @polodibujanye
    @polodibujanye 4 місяці тому

    *¡Lo mejor que vi. Le voy a aplicar la animacion suave para esconderlo de entrada y salida.!*
    *GRACIAS*

  • @DavidLopezCubo
    @DavidLopezCubo Рік тому

    Muy buen laburo loco! clarisimo y facil!

  • @josedavidricaldeberrocal8860
    @josedavidricaldeberrocal8860 Рік тому +1

    Muchas gracias Carpi por compartir tus conocimientos.

    • @carpicoder
      @carpicoder  Рік тому

      Gracias José por el comentario! 🙌

  • @jaimebravo2762
    @jaimebravo2762 Рік тому

    Muy buena la explicación y el tiempo empleado. Gracias

  • @armakaisen
    @armakaisen 29 днів тому

    siiiii... super! si vueltas. Muchas gracias men! Excelente.

  • @DavidCarrizoGuitarra
    @DavidCarrizoGuitarra 5 місяців тому

    Muy lindo y divertido! Además de practico y sencillo, saludos!

  • @alejandrocotishow7604
    @alejandrocotishow7604 Рік тому

    Felicitaciones muy buena y profecional tu explicacion

  • @joelrm1786
    @joelrm1786 Рік тому

    Muy buen video, lo ocuparé para un proyecto, es fácil y muy sencillo de entender. Explicas muy bien, nuevo sub❤

    • @carpicoder
      @carpicoder  Рік тому

      Muchas gracias amigo! 💖💪🏼✨

  • @LuisAlfonso-nica
    @LuisAlfonso-nica 2 місяці тому

    ESta buenisimo el tuto; felicidades porque yo que no he estudiado programacion solo tengo ligeros conocimientos empiricos, le he entendido mucho.

  • @superjulPia
    @superjulPia Рік тому

    Muchas gracias por compartir tus conocimientos y por tu tiempo!!Es de GRAN utilidad 💯👏🙌

  • @pmgutierrez2700
    @pmgutierrez2700 Рік тому

    Gracias Carpi, me ayudaste mucho , tenia una pagina web que no se podia ver en celu ahora con esta ayuda la voy a dejar para mobile

  • @borjaarquesamat6371
    @borjaarquesamat6371 20 днів тому

    Muchas gracias, me ha servido un monton, ahora intentare aprender a hacer una transición entre ambos iconos de apertura y cierre, a ver .... como lo hago jajjja, gracias de nuevo!

  • @jorgeandresromano2663
    @jorgeandresromano2663 Рік тому

    gracias hermano! muy util y entendible todo! Saludos

  • @amneriscalle
    @amneriscalle Рік тому +1

    Genio. ¡Gracias!

  • @Niiko0akd
    @Niiko0akd Рік тому

    Esto es simplemente excelente.

  • @benjaminurquia9452
    @benjaminurquia9452 17 днів тому

    Gracias! Perfectamente explicado!

  •  Рік тому

    Excelente, me encantó. Muchísimas gracias por este video.

  • @Irvin_Gonzalez
    @Irvin_Gonzalez Рік тому

    Gracias hermano de corazón te agradesco por este tutorial me gustó mucho tu forma de explicar

  • @facundosolan90
    @facundosolan90 Рік тому

    Siempre un lujo ver tus videos querido Carpi! Como hago para ve el navegador al lado del codigo que voy escribiendo??

  • @Adormir123
    @Adormir123 9 місяців тому

    simple y practico, muchas gracias!

  • @pablodemartini6318
    @pablodemartini6318 7 місяців тому

    Buenisimo, re bien explicado. Gracias por el video.

  • @leonardofabioacevedo2566
    @leonardofabioacevedo2566 Рік тому +1

    Genial como lo explicas, pero que debo hacer para que quede siempre el botón de hambuerguesa, es decir que no me aparezca el menú en el nav , solo cuando doy click en el boton quiero que aparezca el menú con las opciones. gracias

  • @invazorzimutube
    @invazorzimutube Рік тому

    Muchas gracias por el tutorial me ayudó mucho!

  • @julianricardo8893
    @julianricardo8893 11 місяців тому

    Muchas gracias, me sirvió. Me suscribo!

  • @fedex224
    @fedex224 Рік тому

    Hola Carpi, excelente video, explicas super bien y claro, además explicas lo que hace cada propiedad y eso se ve poco en otros videos, seguí asi!!
    tengo una consulta, que extensión usas para tener el codigo y el navegador en una misma vista?

    • @carpicoder
      @carpicoder  Рік тому +1

      Live Preview! Gracias por el lindo comentario 💖✨

  • @henryazogue9657
    @henryazogue9657 7 місяців тому

    te lo agradezco mucho - e pasado mucho tiempo para buscar una respuesta --- sos muy creativo 😃

  • @soymatrixmoy
    @soymatrixmoy 5 місяців тому

    Gracias por explicarlo tan claro 🎉

  • @Sant3tsu
    @Sant3tsu Рік тому

    muchas gracias me ayudaste un monton, lo unico vas muy rapido, lo bueno es que podemos poner pausa o retroceder, luego con pura logica, pude terminar de darle funcionalidad, para que cuando aprete una de las opciones se salga el menu, mil gracias

  • @SolaPazEnergy
    @SolaPazEnergy Рік тому

    Me gustó tu trabajo. Saludos

  • @JuanHinojosa-jh7wg
    @JuanHinojosa-jh7wg 5 місяців тому

    Muchas gracias, me sirivio muchisimo, sos un genio!!!

  • @jonathang6119
    @jonathang6119 Рік тому +1

    amigo una pregunta, si quiero que al apretar el botón del menú haga una animación que vaya apareciendo de la derecha, que estilo debería de agregar para que haga esa animación?. vi que agregaste opacity en 0 y visibility en hidden pero que deberia agregar para que haga la animación?

  • @gleide-coelho
    @gleide-coelho Рік тому

    Muy bueno!!!! Muchas gracias!!!!

  • @cintiavicente8883
    @cintiavicente8883 6 місяців тому

    Qué bien que explicás!

  • @salvadorambriz1406
    @salvadorambriz1406 Рік тому

    Muchas gracias, super bien explicado y sencillo tu ejemplo. Hay alguna forma de que la transición entre mostrar el menu y cerrarlo sea mas amigable? Saludos

    • @carpicoder
      @carpicoder  Рік тому

      Se puede transicionar con transform y cambiando el display por visibility y opacity, que son propiedades transicionables!

  • @AymanE-b8i
    @AymanE-b8i Рік тому +1

    Lo primero es agradecerte tu trabajo, y tu tiempo para nosotros es ORO!
    Tenía una pequeña duda, y es que, al crear el script en js, no me funciona, Podrías decirme porque podría ser??
    Gracias y espero su respuesta!!

  • @dahianamachado-nr9pp
    @dahianamachado-nr9pp 5 місяців тому

    Muchas gracias muy buen video!

  • @hpta
    @hpta 5 місяців тому

    sos un capo amigazo te amo

  • @andresrosental9136
    @andresrosental9136 3 місяці тому

    Muchas gracias por la explicación... Tengo una consulta.
    Es posible hacer un menú hamburguesa sin medias querys?

  • @ladelec
    @ladelec 7 місяців тому

    Excelente! una pregunta: como sería la modificación para que un item tenga varios subitem y solo se vean al hacer click?

  • @malaganx236
    @malaganx236 8 місяців тому

    Grande Maestro!!!

  • @renzomonico4018
    @renzomonico4018 Рік тому

    Buenísimo tutorial!

  • @walter3867
    @walter3867 Рік тому

    Me ayudo muchísimo, enserio gracias :3

  • @johanlex2035
    @johanlex2035 4 місяці тому

    se nota que hace las cosas con cariño, me agrado la explicación, lo único es que me confundió la portada porque en sí el resultado tiene unos mejores tonos, gracias

    • @carpicoder
      @carpicoder  4 місяці тому +1

      @@johanlex2035 gracias! El cambio de portada fue un intento de ver cómo funcionan los algoritmos de UA-cam jajajaja

  • @TulikoKKo702
    @TulikoKKo702 Рік тому

    muy buen video, gracias!

  • @yuliannydiaz9259
    @yuliannydiaz9259 Рік тому +2

    Excelente explicacion, solo que intente hacerlo pero me queda visible el boton de abrir cuando desplego la nav (es decir se me ven ambos botones abrir y cerrar al mismo tiempo) cual sera el error

    • @gustavogromas5822
      @gustavogromas5822 Рік тому

      no tenes error, esta usando una linea no explicada en el video, fijate linea 8 html.

  • @AgustinFleitasFaes
    @AgustinFleitasFaes 10 місяців тому

    Gracias por el tutorial, rey Después agregué un listener a los links de la Nav y cuando se toca alguno la Nav se cierra, quedó flamingo (?

  • @brayamstivencamposospina3350
    @brayamstivencamposospina3350 8 місяців тому

    Tengo una pregunta cuando selecciono un ítem del menú no me cierra automáticamente el menú ... que debo hacer ?😢

  • @JuanDiegoSuavita
    @JuanDiegoSuavita 10 місяців тому

    Eres un genio, gracias

  • @carlospaz3277
    @carlospaz3277 7 місяців тому

    Super, excelente explicación

  • @nicoqk
    @nicoqk 9 місяців тому

    excelente explicación, clara y concisa! pero me surgió un problema a aplicarlo. hice el nav y debajo hay un section con un carrusel de imágenes en boostrap. cuando estoy en pantallas chicas al desplegar el menú este se ve por debajo de las imágenes del carrusel. estuve investigando y vi que se podría corregir con z-index, pero no me funcionó. podrías ayudarme? Gracias!

  • @JosephGianmarcoSoberonLeon
    @JosephGianmarcoSoberonLeon Рік тому

    El video esta bueno gente

  • @nicolasquinteros450
    @nicolasquinteros450 Рік тому

    noooo esta TREMENDOO

  • @TheBryanRedz
    @TheBryanRedz Рік тому

    Muy buen video sencillo, claro y rápido. (y)

  • @kokucsm
    @kokucsm Рік тому

    Gracias brooo!!! muy util :D

  • @arlettekid
    @arlettekid Рік тому

    hermano buenas noches me encanto tu proyecto, una pregunta como lo hago funcionar, oesa q al dar clic me lleve donde quiero pero dentro del mismo, oses como un menu intradocumental

  • @enzocaceres1818
    @enzocaceres1818 2 місяці тому

    videasoooooooooooooo!!!!

  • @b.y.sproduccionesbyronmora3605
    @b.y.sproduccionesbyronmora3605 9 місяців тому

    que tal amigo esta muy bien, pero no entiendo que hice mal porque no me quiere abrir el menú, dependerá del js?

  • @joaquin-q4v
    @joaquin-q4v 10 місяців тому

    Buen video!

  • @your_dev_joselow
    @your_dev_joselow Рік тому

    rapido y sencillo que crack

  • @seleneneptuno2578
    @seleneneptuno2578 Рік тому

    gracias!! me re sirvió
    pero tengo un problema, cuando recargo la pagina en el celular me queda el menu desplegado, me lo muestra abierto predeterminado..

  • @Hyuu17
    @Hyuu17 3 місяці тому

    excelente explicacion!!!!

  • @Joel-kr6ex
    @Joel-kr6ex 11 місяців тому

    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.

  • @osposto
    @osposto 6 місяців тому

    Muy bueno el contenido, pero hay un detalle que me preocupa. Qué pasa si hay links activos cuando abres el menú, en el lado izquierdo, el que se encuentra en la sombra? Saludos.

  • @CitizenWorld81
    @CitizenWorld81 7 місяців тому

    Me encantó el video

  • @lucilaromandini7946
    @lucilaromandini7946 Рік тому

    cuando achico la pantalla me aparece el botón de abrir pero no me abre el menu, que puede ser, segui tal cual los pasos

  • @3DRACING27
    @3DRACING27 Рік тому +1

    gracias por el video!! me sirvió muchisimo, solo tengo el siguiente problema... cuando pongo bottom:0; el menu desplegable en vez de ocupar toda la pantalla, ocupa el mismo alto que el header, que podrá ser?... el nav list sigue bien, en vertical, pero el color de fondo ocupa el mismo alto que el header... gracias!

  • @arapolanco6762
    @arapolanco6762 Рік тому

    Genial, gracias

  • @elmaguez
    @elmaguez 7 місяців тому

    video de referencia muy bueno lo he compartido con mis colegas, aunque me queda una duda, no es de codigo, como hace para en los href poner esa linea vertical y llenar todas las 5 lineas con #? si alguien sabe muy agradecida

    • @carpicoder
      @carpicoder  7 місяців тому

      Tenés que hacer clic en el primer lugar de todos, luego mantener apretado ALT SHIFT y hacer clic en el último!
      Si es en lugares diferentes (que no coinciden verticalmente), hacés clic en el primero, mantenés ALT y vas haciendo clic en los demás!

  • @bluefutbol1515
    @bluefutbol1515 Рік тому +3

    Amigo busco uno asi pero en mobile firts :c

  • @WhiteWolf-fm7yg
    @WhiteWolf-fm7yg Рік тому

    Excelente video, solo estoy teniendo problema que al momento de estirar de nuevo la pantalla para que se elimine el botón no aparece el el menú solo el logo... Algún consejo 😅

  • @barbaracelestediaz5338
    @barbaracelestediaz5338 Місяць тому

    como se hace para que el INICIO, te lleve directo a esa parte en la pagina? igual que en el quienes somo, etc

  • @mareklara
    @mareklara Рік тому

    me gusto mucho pero me.hubiera gustado ver cuando le das click a uno de los links, que el menu se cierre tambien. Tal vez con un forEach a los li.

    • @carpicoder
      @carpicoder  Рік тому

      Exacto, con un forEach en todos los "li > a" deberías poder hacer eso también!

  • @renzovannucci3538
    @renzovannucci3538 3 місяці тому

    Hola! por qué usaste un enfoque desktop first en el responsive? saludos!

    • @carpicoder
      @carpicoder  3 місяці тому

      @@renzovannucci3538 Es lo que usé toda la vida y por costumbre jajaja no hay más explicación 😂

  • @micacorvera4300
    @micacorvera4300 Рік тому

    muy bueno!!! muchas gracias por el video, me solucionó la vida jajsjs. Tengo una consulta, ¿Cómo hago para que cuando abra mi página en mobile, no aparezca el menú ya abierto?

    • @carpicoder
      @carpicoder  Рік тому

      Hay que iniciarlo oculto! Fijate que por defecto arranca oculto en mis ejemplos!

    • @seleneneptuno2578
      @seleneneptuno2578 Рік тому

      @@carpicoder cómo sería iniciarlo oculto? no puedo solucionar ese problema

  • @manuelgattone2855
    @manuelgattone2855 Рік тому

    Una pregunta que pagina web usas para sacar las imágenes? Porque no consigo imágenes buenas , no iconos sino imagenes

  • @ikki5414
    @ikki5414 8 місяців тому

    Gracias me sirvió

  • @agustinbraco1208
    @agustinbraco1208 Рік тому

    Gracias Carpi!

  • @faq3154
    @faq3154 Рік тому

    Buen video pa