Para los que no les sale el ejercicio es porque falta agregar la propiedad transform: translateX(100%); en el código css en la clase .menu_links. A mí no me salía lo del menú hamburguesa, pero agregué eso y ya sale.
Gracias... Veo que muchos en los comentarios dicen que no les funciona el JS. Creo que es porque en la parte cuando creamos la constante de addClick en la ultima parte, esta: subMenu.style.height = `${height}px`; ponen esta parte ==> `${height}px` dentro de cualquier tipo de comillas. Al principio puse esa parte en estas comillas ´´ y no me funcionaba; probé con las que decia Alex en el video y me funcionó. Ojalá a ustedes les sirva lo que acabo de decir, y espero haberme echo entender. Saludos.
Esta buenísimo. Lo he probado en algunas aplicaciones y hasta ahora todo ok. Lo voy a incluir en un pequeño framework de css para no tener que hacer siempre el menú desde 0.(trato de no usar bootstrap para todo) Gracias!!
Lo hice y quedó bien, pero cuando quiero poner algo debajo del nav luego no le cargan los estilos, a menos que lo ponga antes que los estilos del menu. Porque será?
Tienes el código subido a algún lado?? Intenté seguirte paso a paso pero tengo un error al desplegar los menús y no lo puedo solucionar. Gracias por el video, esta genial!
Magnifico tutorial Alex, pero me gustaría hacerte una pregunta: ¿Las custom properties que utilizas para mostrar o esconder los menús desplegables, se pueden sustituirse por la propiedad display: block/none?. Gracias por tu atención y por el trabajo que realizas para enseñarnos cosas nuevas a todos. Un saludo desde Madrid, España.
Hola, hice todo tal cual al video incluso lo vi mas de una ves para asegurarme que estuviera bien pero para dispositivos móviles no funcionan los subMenus, a alguien mas le paso?
@@eliaslopez2596 y has visto algún otro video donde expliquen un menú desplegable adaptable a dispositivos móviles... O menús desplegables responsibe? Es que no eh encontrado uno bueno :(
alex, lo que me pasa es que al crear un menu responsive con js al hacer responsive de desktop a movil el navbar siempre hace un efecto de ocultandose feo, osea al achicar la ventana para pasar a vista menor de 768px aparece el navbar desplegable pero siempre haciendo la animacion llendose para arriba
Amigo gracias por compartir tus concimientos. Estoy escribiendo los archivos como tu haces pero el menu me sale siempre a la izquierda, cómo puedo hacer. Gracias
Excelente video amigo, aun tengo algunos errorcitos, pero ahi la llevo, lo estoy maquetando de otra forma, el menu fijo del lado izquierdo para escritorio y menu flotante para Mobil, muchas gracias por tu aporte, salu2 desde la CDMX,
buenas, excelente el tutorial...solo tengo un problema....no funciona el menu hamburguesa al darle click, digamos que no se despliega . El codigo esta identico al tuyo...sera error de crhome???
Hola Alexcg espero que estes bien, te escribo este comentario porque tengo una duda respecto a esa funcion para limitar el alcance de las variables, donde puedo buscar informacion respecto a ese tipo de funcion? ya que llevo un tiempo estudiando javascript y es mi primera vez que veo algo como eso
Siii, si puedes, de hecho al momento de elegir el plan puedes ver más características y veras todas esas opciones, también si no te gusta Hostinger tienes 30 días para probarlo, sino te reembolsan tu dinero:)
Excelente video mi estimado Alex, felicitaciones. Te pido un favor, lo podras subir el CODIGO a github, porque tengo algunos errores, me pierdo porque esos cambios hechos tras camara. Te lo agradezco mucho
Esta muy bueno el tutorial, lo unico que siempre siempre noto en sus videos es que siempre poner pero me falto decirle etc.o toca ponerle y eso enreda bastante, creo que deberia decirlo de una vez y si lo va a explicar que lo explique en el momento no despues y lo noto siempre solo en el codigo del HTML eso deberia mejorarlo.
Hola @AlexCGDesign, primero que nada, gracias por esta explicación y por el material (está excelente), solo como comentario para todos chicos, revisar que solo está funcionando a la perfección en el navegador Google Chrome y se aplican todos los cambios hechos, en el navegador Firefox no se aplican ciertos detalles, pero igual funciona.
Hola, oye que buenos videos tienes eh visto a varios, pero habría posibilidad que hicieras uno de como pasar un pdf o un ai a Html o como acomodarlo para que se vea la pagina sin necesidad de que haga mas, solo visualizarla en html para que se pueda mandar como un flyers por correo masivo, soy diseñador y tengo el flyer pero no puedo pasarlo a Html use scripts y convertidores pero el server no lo lee bien siempre falla algo una imagen no se ve o el texto sale desalineado y creo seria mejor hacerlo desde cero, ojala puedas hacer uno video de eso, Gracias!
buenas noches maestro alex, espero te encuentres bien. Cuando tengas tiempo puedes subir el código por favor, tengo algunos errores y no puedo dar con ello. te agradezco saludos.
alguien podria ayudame con el siguiente error app.js:8 Uncaught TypeError: element.addEventistener is not a function element.addEventistener('click', ()=>{ let subMenu =element.children[1]; let height = 0; element.classlist.toggle('menu_item--active'); if(subMenu.clientHeight === 0){ height = subMenu.scrollHeight; } subMenu.style.height = '${height}px'; }); l
![[UNCUT]“ฅนตื่นธรรม”ปะทะ“หมอปลา-ปู่มหามุนี-อั๋นโอกิ”สะเทือนกระทรวงเวทมนตร์ Iคนดังนั่งเคลียร์I10 ตค.67](http://i.ytimg.com/vi/peMD_SAkwNc/mqdefault.jpg)
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss
Create Responsive Services Section Using Only HTML & Css
th-cam.com/video/kBV6NMrFhqA/w-d-xo.html
gracias por el tutorial :'3 costo pero lo logre :3 un poco confuso a partir del minuto 35 pero bueno hay que prestar mucha atencion nomas :3
Gracias a ti fue que empecé en el desarrollo web, ya compre y vi tu curso de css, ahora a practicar js.
Para los que no les sale el ejercicio es porque falta agregar la propiedad transform: translateX(100%); en el código css en la clase .menu_links. A mí no me salía lo del menú hamburguesa, pero agregué eso y ya sale.
Gracias... Veo que muchos en los comentarios dicen que no les funciona el JS. Creo que es porque en la parte cuando creamos la constante de addClick en la ultima parte, esta: subMenu.style.height = `${height}px`; ponen esta parte ==> `${height}px` dentro de cualquier tipo de comillas. Al principio puse esa parte en estas comillas ´´ y no me funcionaba; probé con las que decia Alex en el video y me funcionó. Ojalá a ustedes les sirva lo que acabo de decir, y espero haberme echo entender. Saludos.
Esta buenísimo. Lo he probado en algunas aplicaciones y hasta ahora todo ok. Lo voy a incluir en un pequeño framework de css para no tener que hacer siempre el menú desde 0.(trato de no usar bootstrap para todo) Gracias!!
En tu código 11 y 13 de javascript no me acepta poner "element" pero si me salió con "elment" quien sabe por qué a ti si te da
MAGNIFICO, gracias por traernos siempre contenido de esta calidad.
Lo hice y quedó bien, pero cuando quiero poner algo debajo del nav luego no le cargan los estilos, a menos que lo ponga antes que los estilos del menu. Porque será?
Tienes el código subido a algún lado?? Intenté seguirte paso a paso pero tengo un error al desplegar los menús y no lo puedo solucionar.
Gracias por el video, esta genial!
Lograste encontrar el código? Según lo iba a subir pero no lo encuentro en su Git...
@@davidmonter2210 No, no lo logre encontrar
Ni modo... Gracias!
Una enorme disculpa, apenas me di cuenta que no subí el código, aquí está: alexcgdesign.com/blog/como-crear-un-menu-desplegable-html-css-js/
Excelente video pero como lo hago en el menu horizontal, no en la vista movil?
Podrías subír el proyecto?, Llevo rato intentando hacer lo de la parte movil pero no ejecuta la acción
Excelente, y ¿Cuándo quiero tener mas submenús dentro de un submenú, como lo haría...?
Excelente video. Se aprenden muchas cosas a medida que se hace el ejercicio simultáneamente con el video
Magnifico tutorial Alex, pero me gustaría hacerte una pregunta:
¿Las custom properties que utilizas para mostrar o esconder los menús desplegables, se pueden sustituirse por la propiedad display: block/none?.
Gracias por tu atención y por el trabajo que realizas para enseñarnos cosas nuevas a todos.
Un saludo desde Madrid, España.
Hola alex, el uso de la custom property gasta muchos recursos?
Hola, hice todo tal cual al video incluso lo vi mas de una ves para asegurarme que estuviera bien pero para dispositivos móviles no funcionan los subMenus, a alguien mas le paso?
a mi tambien me fallo lo de los submenus para dispositivos moviles, pudiste solucionarlo? :(
@@carlosalejandrobarreramart8748 no, no pude lamentablemente
@@eliaslopez2596 y has visto algún otro video donde expliquen un menú desplegable adaptable a dispositivos móviles... O menús desplegables responsibe? Es que no eh encontrado uno bueno :(
Hola , tengo un problema y es que tengo un problema, para ver si me puede ayudar
alex, lo que me pasa es que al crear un menu responsive con js al hacer responsive de desktop a movil el navbar siempre hace un efecto de ocultandose feo, osea al achicar la ventana para pasar a vista menor de 768px aparece el navbar desplegable pero siempre haciendo la animacion llendose para arriba
Muchas Gracias por compartir tus conocimientos. Me ha servido mucho sigue así Crack.
Amigo gracias por compartir tus concimientos. Estoy escribiendo los archivos como tu haces pero el menu me sale siempre a la izquierda, cómo puedo hacer. Gracias
Lo vi de referencia en Twitter, muchas gracias
ya metiste JS , excelente Alex, siempre el mejor!!!!
muy buen menú, deberías subir el código a github, mas aun si haces modificaciones detrás de cámara porque los novatos nos perdemos jajaja
@GCode Tu comentario no aporta nada a las interrogantes de tus audiencia.
tiene un problema en los arrows cuando es responsive cuando se oculta el submenu no regresa al estado original
Excelente video amigo, aun tengo algunos errorcitos, pero ahi la llevo, lo estoy maquetando de otra forma, el menu fijo del lado izquierdo para escritorio y menu flotante para Mobil, muchas gracias por tu aporte, salu2 desde la CDMX,
hay un error al momento de llegar a 300px para abajo los sub menus desplegables ya no aparecen
no me funciona porque cada vez que doy click quiere recargar la pagina alguien me ayuda?
Hola, tengo una pregunta, si yo no quiero que sea con el efecto hover sino con el click, con que pseudoclase lo podria hacer?
Podrías poner elementos checkbox, o usar la pseudoclase active. Pero como tal una pseudoclase para detectar un click, aún no hay
buenas, excelente el tutorial...solo tengo un problema....no funciona el menu hamburguesa al darle click, digamos que no se despliega . El codigo esta identico al tuyo...sera error de crhome???
ya SOUCIONADO!!! :) EXCELENTE TUTO!!!
ese archivo de ASSETS QUE ESTENSION ES O ES UNA CARPETA
NO ENTENDI ESA PARTE.
sos el mejor SHORDAAANNNNNNNNNN!!!!!!
Vamos por el código 🇲🇽
Hola Alexcg espero que estes bien, te escribo este comentario porque tengo una duda respecto a esa funcion para limitar el alcance de las variables, donde puedo buscar informacion respecto a ese tipo de funcion? ya que llevo un tiempo estudiando javascript y es mi primera vez que veo algo como eso
Excelente trabajo lo que estaba buscando 👍
hola alex, cuando presiono un link del subMenu se cierra el menu desplegable, Porque? saludos desde RD.
muy bueno, felicitaciones
Gracias alex por estos tutoriales , te explicas muy bien queria sabe si tienes algun curso de javaScript
Men no sirve el codigo js
se me agranda al darle click pero no me encoge
ya llegastes a la meta sube el archivo
Julian, una disculpa por el retraso. Ya subí el código: alexcgdesign.com/blog/como-crear-un-menu-desplegable-html-css-js/
Algún día harás curso de alguna librería?
Hola Alex que tal sobre Hostinger puedo subir proyectos php usando framework LARAVEL, acceder al ssh y tambien utilizar o instalar git pregunto?
Siii, si puedes, de hecho al momento de elegir el plan puedes ver más características y veras todas esas opciones, también si no te gusta Hostinger tienes 30 días para probarlo, sino te reembolsan tu dinero:)
@@AlexCGDesign Excelente gracias...
Gracias por el tutorial, está muy bien. Me hubiese gustado que fuese mobile firts.
Como hago un menu dentro del submenú?, Por ejemplo:
*Inicio
*Nuestros productos
* Sabanas
* Doble
* Sencilla
*Contacto
Excelente video mi estimado Alex, felicitaciones. Te pido un favor, lo podras subir el CODIGO a github, porque tengo algunos errores, me pierdo porque esos cambios hechos tras camara. Te lo agradezco mucho
Excelente alex!!
Hola, alex. Tienes en descuento en css avanzado?
Es que el link que dejaste solo me abre el del web completo, pero yo quiero el de css avanzado
👏🙌
Tengo un error me gustaria que cumplieras y subieras el código la verdad necesito este menú
Hola David, una disculpa por no subir el código, aquí está ya: alexcgdesign.com/blog/como-crear-un-menu-desplegable-html-css-js/
Hubiera estado genial que empezaras con el diseño mobile. Excelente diseño en general. Gracias
La próxima será así!
Esta muy bueno el tutorial, lo unico que siempre siempre noto en sus videos es que siempre poner pero me falto decirle etc.o toca ponerle y eso enreda bastante, creo que deberia decirlo de una vez y si lo va a explicar que lo explique en el momento no despues y lo noto siempre solo en el codigo del HTML eso deberia mejorarlo.
Dale, muy bueno.
excelente hermano
muchidimas graciasss
te quiero jordan
Excelente
hola amigo, me pasas los codigos porque no puedo hacerlo porfavor
excelente
Hola @AlexCGDesign, primero que nada, gracias por esta explicación y por el material (está excelente), solo como comentario para todos chicos, revisar que solo está funcionando a la perfección en el navegador Google Chrome y se aplican todos los cambios hechos, en el navegador Firefox no se aplican ciertos detalles, pero igual funciona.
Gracias Joao! Un saludo enorme!
No está el codigo en su github, deberias de subirlo. Gracias.
Hola, aquí puedes encontrar el código :)
alexcgdesign.com/blog/como-crear-un-menu-desplegable-html-css-js/
Hola, oye que buenos videos tienes eh visto a varios, pero habría posibilidad que hicieras uno de como pasar un pdf o un ai a Html o como acomodarlo para que se vea la pagina sin necesidad de que haga mas, solo visualizarla en html para que se pueda mandar como un flyers por correo masivo, soy diseñador y tengo el flyer pero no puedo pasarlo a Html use scripts y convertidores pero el server no lo lee bien siempre falla algo una imagen no se ve o el texto sale desalineado y creo seria mejor hacerlo desde cero, ojala puedas hacer uno video de eso, Gracias!
buenas noches maestro alex, espero te encuentres bien. Cuando tengas tiempo puedes subir el código por favor, tengo algunos errores y no puedo dar con ello. te agradezco saludos.
Que proooo
Saludos tienes curso de js?
Muy bueno
Salvaste mi vida
buenisimo
nice tuto.
Gracias Isaac, un saludo!
Create Responsive Services Section Using Only HTML & Css
th-cam.com/video/kBV6NMrFhqA/w-d-xo.html
Creo que me confundió bastante tu lógica en Javascript.
ya rolaloo
No abre el submenu en js
Hola Juan, te comparto el código del menú para que veas si tienes algún error: alexcgdesign.com/blog/como-crear-un-menu-desplegable-html-css-js/
buen video
35:00 desde aca me trabe xD si alguien me comenta se lo agradezco asi no me olvido de continuarlo
lo logreee :'3 todo era la culpa de mi theme no me di cuenta que puse , en vez de . por que con ese color no se veia nada
@GCode gracias, me voy a pasar por tu canal :3
👍👍👍
Nunca encontré la manera de crear el svg al principio en VSC, ajajajajjaa.
@GCode Gracias bro!!! Groso!!!
No llego a 300 comentarios xdd
La raza no quiere el código, pero yo si :(
Pasa el código bro xd
1
nos faltan 2 likes, para tener el codigo
12
puedo meter un submenu adentro de este menu? gracias
alguien podria ayudame con el siguiente error app.js:8 Uncaught TypeError: element.addEventistener is not a function
element.addEventistener('click', ()=>{
let subMenu =element.children[1];
let height = 0;
element.classlist.toggle('menu_item--active');
if(subMenu.clientHeight === 0){
height = subMenu.scrollHeight;
}
subMenu.style.height = '${height}px';
});
l
12