Me encantooo. Hace poco comence a estudiar y estoy terminando css, aun no arranco con js y tenia tremendas ganas de hacer un menu como este. Me vino genial
No es miedo, es que, al menos para los que venimos de C++ o C# es altamente desesperante que JS no marque errores (bueno, algunos de ellos) sino hasta tiempo de ejecución, tampoco me gusta el tipado automático, prefiero ser muy explícito en cuanto al tipo de datos así que, aunque lo uso (suelo usar ASP:NET y C#) prefiero omitir JS en lo posible.
No sé por qué en el minuto 16:46 llegué bastante bien, pero al poner el clip path 100 at center, no me funciona el check box. Está todo en el html escrito igual que lo has hecho vos, y en el css tmb
Man cuando pongo Gap y esas tres líneas no me agarra osea pongo el inspecccionador y sale que nombre o comando Uknow sabrás porque? Igual con el --clippy ese comanp no sale pq? Ayuda Bro :(
muy buen tutorial, solo tengo una duda, cuando le doy clip a inicio, o a alguno de los enlaces dentro del menú, el menú no desaparece se queda fijo, hasta que presione el icono del menú de nuevo. Estoy buscando una forma en la que la salida del menú sea tanto el enlace como el icono sin tener que usar JS, pero no se me ocurre aun algo .... si alguien tiene una pista se lo agradecería
Hola, muy buena explicación, me agrado mucho el vídeo, me gustaría saber cómo poder ocultar el contenido de la página al momento de desplegar el menú ya que se muestra la información que hay en la página, saludos.
Buenas! tengo una duda. Yo arriba de mi navbar tengo un header de bienvenida, mi nav está configurado con position sticky y todo el proceso funciona bien. El problema es que cuando a lo que usted seleccionó como 'nav-menu' le doy la position fixed, se ve bien pero si subo o bajo sube conmigo, yo quiero que se quede estático debajo del menú del navbar
añade z index:100 despues de la position: fixe esas dos propiedades va hacer lo que quieres lo unico es que tienes que agregar width:100% para te ocupe toda la pagina
Todo bien con el menú, muchas felicidades, me encantó. Solo una duda, al ver mi menú, como que se desplaza un poco hacia abajo, ya que no se logra visualizar todas las opciones del mismo. Me pasa principalmente cuando veo la página en el celular y pantallas pequeñas. De hecho, se desprende de la barra superior. Me podrías orientar?? De antemano gracias
Hola. Enhorabuena por el tutorial. Se puede con CSS que cuando se hace click una opción del menú en la media query, se escondan las opciones del menú como si hubiéramos dado en el icono del menú que lo abre y lo cierra?
Hola muy muy buen video, es una solución muy ingeniosa que a casi ninguno se le hubiera ocurrido, Este video me ha venido de perla ya que estoy haciendo una aplicación con PHP y necesito un menú desplegable para que sea responsive, y si bien podría usar Javascript , realmente no me sirve porque partes de el html están dentro de bloques de lógica y me da el error: El script de “x” fue cargado a pesar de que su tipo MIME (“text/html”) no es un tipo MIME válido de JavaScript.
3er video tuyo que miro, ya me suscribí y tengo las notificaciones. Un genio como explicas! Podrias hacer un tutorial sobre indispensables y necesarios de JS para paginas web? Su utilizacion y utilidad. Seria el video mas visto por programadores jr :P
Hola buenas, Muchas gracias por el video, podrían ayudarme? he hecho el menu con position fixed y al hacer scroll mi nav se vuelve color blanco y deseo que el icono svg se vuelva color negro podria ayudarme a saber como se hace con css?
@@AlexCGDesign faltó algo muy importante, cuando se haga clic en alguno de los enlaces el menú debe cerrarse y dirigirse a la sección seleccionada, pero buen vídeo de todos modos
Esta muy bien el video pero si tienes elementos abajo estos elementos pueden estorbar y se ve muy feo y no funciona. A mi me llego a pasar pero implemente un script en Javascript como complemento que corrige eso y quedo muy bien.
Tengo entendido que todo lo que se pueda hacer con CSS se haga asi por cuestion de peso y que cargue mas rapido la pag dado que JS tiene mas peso, es tan asi? O en este caso JS lo hace mas simple entonces deberia hacerse asi? Espero que se entienda la preg
una consulta asi como ordenar bonito (dar formato) al codigo HTML con control alt +F ...........Como das formato para que se vea bonito el codigo.css ???????
@@waltercg7788 desconozco, pero normalmente se usa un formateador de código, de hecho en el vídeo se ve que el usa prettier , que es de los más populares, se instala como una extensión para visual Studio Code y creo que igual sirve para otros editores de código, chécalo es muy buena herramienta
Yo recomendaría hacerlo más con JS, solo serian agregar 6 líneas, esto por el tema de compatibilidad, pero estos ejercicios ayudan a reforzar bastante CSS3:)
seria buenisimo que dejaras una copia del codigo que realizas en cada video para que asi nos sea mas facil el practicarlo!!! saludos desde San Juan Argentina...... si subes el codigo me suscribo y paso tus videos a otros comapñeros
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.
Para ello debes usar Ids en tus section q deseas ir y para cerrar al dar click en un ítem del menú , debes usar javascript ya q en css no se puede seleccionar ascendentemente 😊
Aprende CSS como NADIE 👉 alexcgdesign.com/cursocss
Me encantooo. Hace poco comence a estudiar y estoy terminando css, aun no arranco con js y tenia tremendas ganas de hacer un menu como este. Me vino genial
Es súper didáctico, pero no le tengan miedo a js, con 5 líneas de código sale esto, sin enrredos.
@Byron Loarte si, claro, mira github.com/bsquiroz/menu_nav, cualquier duda me escribes.
No es miedo, es que, al menos para los que venimos de C++ o C# es altamente desesperante que JS no marque errores (bueno, algunos de ellos) sino hasta tiempo de ejecución, tampoco me gusta el tipado automático, prefiero ser muy explícito en cuanto al tipo de datos así que, aunque lo uso (suelo usar ASP:NET y C#) prefiero omitir JS en lo posible.
@@stivenquiroz6904 acabo de basarme en tu código para hacer el de mi página, me sirvió mucho, gracias!
No sé por qué en el minuto 16:46 llegué bastante bien, pero al poner el clip path 100 at center, no me funciona el check box. Está todo en el html escrito igual que lo has hecho vos, y en el css tmb
estoy en la misma y no responde ningún comentario este muchacho...
Como decimos en República Dominicana, eres el mejor jajajaj un abrazo de este lado.
Excelente video men una sugerencia, deja un archivo de ejemplo, ayudaría mucho una base para trabajar.
Un cordial saludo
hermanos, sos grande excelente contenido y explicación Sensey saludos desde El Salvador
Gracias! tu manera de explicar me ayudo a entender como funciona
Amigoooo muchas gracias, estaba buscando un nav simple, peo el tuyo es epico tienes mi merecida sub tqm
pues como hacer que eso funcione en el navegador edge? ya que no me funcionan lo efectos...
Man cuando pongo Gap y esas tres líneas no me agarra osea pongo el inspecccionador y sale que nombre o comando Uknow sabrás porque? Igual con el --clippy ese comanp no sale pq? Ayuda Bro :(
una pregunta ese archivo assets o que extension porque tiene otro icono
lamentablemente hice todo exacto.. pero le doy click y no se me ativa quedo nuevamente con el error del clip-path
muy buen tutorial, solo tengo una duda, cuando le doy clip a inicio, o a alguno de los enlaces dentro del menú, el menú no desaparece se queda fijo, hasta que presione el icono del menú de nuevo. Estoy buscando una forma en la que la salida del menú sea tanto el enlace como el icono sin tener que usar JS, pero no se me ocurre aun algo .... si alguien tiene una pista se lo agradecería
Encontraste alguna solución?
Esto es genial creo pondre la meta de ver un tutorial a la semana creo que aprendere un montón
Me encata el estilo de como queda saludos.
Wow!! te pasaste viejo! está buenísimo
Hola, muy buena explicación, me agrado mucho el vídeo, me gustaría saber cómo poder ocultar el contenido de la página al momento de desplegar el menú ya que se muestra la información que hay en la página, saludos.
pudiste averiguar cómo se hace?
Como hago que desaparesca al dar click?
Grande Ale te sigo en todos los videos sos muy práctico para explicar gracias
Excelente video! muy buena explicación y muy buenos los efectos! Muchas gracias por compartir!👍
Buenas! tengo una duda. Yo arriba de mi navbar tengo un header de bienvenida, mi nav está configurado con position sticky y todo el proceso funciona bien. El problema es que cuando a lo que usted seleccionó como 'nav-menu' le doy la position fixed, se ve bien pero si subo o bajo sube conmigo, yo quiero que se quede estático debajo del menú del navbar
añade z index:100 despues de la position: fixe esas dos propiedades va hacer lo que quieres lo unico es que tienes que agregar width:100% para te ocupe toda la pagina
Buen dia, Disculpa como funcionaria este menu pero para un UL, mi menu lo tengo en UL y no me reconocer la clase del UL para que se despliegue el menu
Excelente explicación hermano, muchas gracias!
Todo bien con el menú, muchas felicidades, me encantó. Solo una duda, al ver mi menú, como que se desplaza un poco hacia abajo, ya que no se logra visualizar todas las opciones del mismo. Me pasa principalmente cuando veo la página en el celular y pantallas pequeñas.
De hecho, se desprende de la barra superior.
Me podrías orientar??
De antemano gracias
Buen video. Fácil de entender y aplicar!!!!
tengo un problema no me aparece la imagen del menu( osea el icono con 3 barritas ) pero si el checkbox
Hola. Enhorabuena por el tutorial. Se puede con CSS que cuando se hace click una opción del menú en la media query, se escondan las opciones del menú como si hubiéramos dado en el icono del menú que lo abre y lo cierra?
Hola muy muy buen video, es una solución muy ingeniosa que a casi ninguno se le hubiera ocurrido, Este video me ha venido de perla ya que estoy haciendo una aplicación con PHP y necesito un menú desplegable para que sea responsive, y si bien podría usar Javascript , realmente no me sirve porque partes de el html están dentro de bloques de lógica y me da el error: El script de “x” fue cargado a pesar de que su tipo MIME (“text/html”) no es un tipo MIME válido de JavaScript.
estupendo el tutorial, pero me gastaría saber como poner otro input que al dar clic en una de los items cierre el menu
3er video tuyo que miro, ya me suscribí y tengo las notificaciones. Un genio como explicas! Podrias hacer un tutorial sobre indispensables y necesarios de JS para paginas web? Su utilizacion y utilidad. Seria el video mas visto por programadores jr :P
Está genial, ¡Graciaaas! :))
Hola buenas, Muchas gracias por el video, podrían ayudarme? he hecho el menu con position fixed y al hacer scroll mi nav se vuelve color blanco y deseo que el icono svg se vuelva color negro podria ayudarme a saber como se hace con css?
Excelente, algo que quería aprender. Aunque podrías sacar también la versión con javascript
Hola Jonathan, claro. Sin ningún problema
@@AlexCGDesign faltó algo muy importante, cuando se haga clic en alguno de los enlaces el menú debe cerrarse y dirigirse a la sección seleccionada, pero buen vídeo de todos modos
@@marcoantoniovalencia8694exacto amigo eso estoy tratando de solucionar pero no puedo, si tu ya lo hiciste ayúdame por favor
@@jusittoledobernal4170 no pude solucionarlo, pero seguí otro tutorial que si lo hacía y me quedé con ese
Excelente video, me ayudaste mucho
que extensión usas para que se vean los iconos de htmls5 y css?
Holaa, se llama VSCODE ICONS:)))
@@AlexCGDesign graciaaaas!!
excelente tutorial , muchas gracias
Muy buen video explicas re bien, un saludo
Gracias, saludos!
gracias amigo, lo pude adaptar a react, en un componente
Que cool!!
Hola buenas, no me abre el menú hamburguesa... Qué debo hacer?
Saludos!
Esta muy bien el video pero si tienes elementos abajo estos elementos pueden estorbar y se ve muy feo y no funciona. A mi me llego a pasar pero implemente un script en Javascript como complemento que corrige eso y quedo muy bien.
Cómo hago para que se cierre el menú cuando le doy clic a un enlace? Estoy haciendo una one page y los enlaces dirigen a la misma página con un #.
pudiste averiguar?
Lo recomendable es trabajar con mobile first.
Tengo entendido que todo lo que se pueda hacer con CSS se haga asi por cuestion de peso y que cargue mas rapido la pag dado que JS tiene mas peso, es tan asi? O en este caso JS lo hace mas simple entonces deberia hacerse asi? Espero que se entienda la preg
Oogway: Yo no sé.jpg XD
una consulta asi como ordenar bonito (dar formato) al codigo HTML con control alt +F ...........Como das formato para que se vea bonito el codigo.css ???????
Usa un formateador de código, cómo prettier
@@josergz osea no hay una combinacion de teclas como el ALT+F en el HTML ???
@@waltercg7788 desconozco, pero normalmente se usa un formateador de código, de hecho en el vídeo se ve que el usa prettier , que es de los más populares, se instala como una extensión para visual Studio Code y creo que igual sirve para otros editores de código, chécalo es muy buena herramienta
José, gracias por el apoyo:)
Un saludo a ambos
@@AlexCGDesign dsculpa crack mi crack
AMIGO, MUCHÍSIMAS GRACIAS
¡Buenísimo!
¿Qué tan recomendable será esta práctica en comparación de hacerlo con js?
Yo recomendaría hacerlo más con JS, solo serian agregar 6 líneas, esto por el tema de compatibilidad, pero estos ejercicios ayudan a reforzar bastante CSS3:)
@@AlexCGDesign ¡Pura vida Alex!
La están rompiendo!
Gracias alex
Me compre tu curso de udemy bro todo chido
Genial Augusto, cual es el tema que más te ha gustado hasta ahora?
@@AlexCGDesign siento que voy a batallar cuando entre a display grid pero sera todo un reto jajajajaja
@@pugliesseaugusto8114 verás que no, que será muy fácil:))
@@AlexCGDesign así como haces ver fácil algunas funciones de css me encantaría que tuvieras un curso en udemy de full Java script desde 0
tu voz me recuerda a Lalo garza "krilin"
Podrías sacar otro vídeo creando una página web ? Porfavor
Claro Anthony!
seria buenisimo que dejaras una copia del codigo que realizas en cada video para que asi nos sea mas facil el practicarlo!!! saludos desde San Juan Argentina...... si subes el codigo me suscribo y paso tus videos a otros comapñeros
Amigo, debieras poner el código y compartir lo que sabes. Yo te compartiría mis conocimientos, pero no te conviene. *Soy Proctologo.*
Paso tanto tiempo que no entiendo nada
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.
Para ello debes usar Ids en tus section q deseas ir y para cerrar al dar click en un ítem del menú , debes usar javascript ya q en css no se puede seleccionar ascendentemente 😊