Curso JavaScript: 81. DOM: Ejercicios Prácticos | Menú de Hamburguesa -

En este video de ejercicios del #DOM de #JavaScript te enseño a hacer un menú de hamburguesa.
💛 Aprende JavaScript aprendejavascr...
📖 Mis notas sobre JavaScript jonmircha.com/...
📖 Mis notas sobre ECMAScript jonmircha.com/...
📖 Mis notas sobre JavaScript Asíncrono jonmircha.com/...
📖 Mis notas sobre JSON jonmircha.com/...
📖 Mis notas sobre el DOM jonmircha.com/dom
📦 Códigos: github.com/jon...
🔔 Suscríbete al canal kzbin.info... 🤓
👉 Visita mi sitio web jonmircha.com/ 💻
🌮 ¿Me invítas un taco? www.paypal.me/...
🤲 Apóyame en Patreon / jonmircha
📫 Suscríbete a mi lista de correo tinyletter.com...

[@JuanCarlosEstevezVargas]

he hecho varios curso de CSS y creí saber CSS, pero esta clase me dejó claro que en esos cursos no mencionan ni la mitad de las propiedades que se usan en éste curso. Simplemente este curso es glorioso.

[@jonmircha]

Esperate a que veas mis próximos cursos de HTML y CSS te volarán la cabeza 🤯 kzbin.info/aero/PLvq-jIkSeTUZYcX9SYwVe7f66afwd9qk_

[@AlejandroGuerrero]

Para los que no se les apliquen los estilos css en la hamburguesa: Es importante poner el link a nuestro css DESPUES del css de hamburguer :-)

[@pacodev3633]

Gracias, me sirvió. Un saludo.

[@MaxielJohannaCamargoGomez]

jajajaa ufff me funciono, tenía rato y nada! Gracias por tu aporte.

[@catrielmagnello1114]

Gracias!!ídolo!!

[@manuelalejandrorodriguezhe5784]

gracias me estaba volviendo loco...

[@marianitaarb]

Genioooo!!!

[@harrinsonA]

en el min 28:38 ud coloca para la propiedad transition: all 300ms ease; aunque esta bien por temas de tiempo y esas cosas. Alguna vez le escuche a una Teacher Gringa en FrontendMasters que especificar las propiedades a animar una por una es necesario puesto que cuando le colocas "all" el navegador se pone en "alerta" ante cualquier cambio y es perjudicial en temas de rendimiento. Muchas Gracias. Algo asi: transition: background-color 300ms ease, color 300ms ease, font-weight 300ms ease;

[@ppmejia9623]

Es correcto, hay que especificar cual es la propiedad a la que se le va a aplicar transition ya que "all" consume más recursos

[@jebusxuy]

¡Gracias por el tip! Acabo de probar con ese código y funciona sin problemas. /../

[@sebastiangonzalez-wj1fj]

100 % recomendado todos tus videos, puedo decir que es mejor que muchos pagos que se consiguen pora ahi, saludos y gracias,mereces mas de unas 100k de reproducciones espero sea así pronto.

[@jonmircha]

Comparte para llegar a más personas 😉

[@marcoantoniovalencia8694]

@@jonmircha Es curioso como a lo largo del curso de JS las subidas y bajadas de sonido ya se mi hicieron natural, aunque ese "HOLA!!!" del inicio siempre me despierta porque se pone el sonido fuerte

[@tallerelvacio]

Yo pensaba que hacer un menu de hamburguesa era re dificil pero gracias a ti no solo lo logre hacer, sino que lo logre comprender !!

[@jonmircha]

😉👋🏻

[@Ni_idea_de_tecnologia]

Sobre el min 40:00 cuando haces click sobre las barras no realiza el cambio de clase, a mi tampoco me funcionaba. Lo he solucionado intruduciendo en el addEventListerner del DCL dos líneas copiada de la primera introduciendo la clase .hamburger-box y .hamburger-inner. Así funciona cuando pulsas en cualquier lugar de la hamburquesa: d.addEventListener("DOMContentLoaded",e=>{ hamburgerMenu(".panel-btn", ".panel" ); hamburgerMenu(".hamburger-box", ".panel" ); hamburgerMenu(".hamburger-inner", ".panel" ); }) Como suele pasar he escrito esto antes de terminar de ver el vídeo. Lo dejo y no lo quito porque esto me enseñará a ser más paciente. Muchísimas gracias Sr. Mircha por enseñarnos de forma fácil a trabajar y a pensar. Aunque por ahora pienso y me equivoco más que trabajo.

[@jonmircha]

👋🏻😉

[@AmirOrtega-wz4bs]

Gracias, tenía el mismo problema

[@dannyvasquezduran]

Este tipo es un héroe sin capa .👍

[@edilymora125]

Uff que video!! Llevo dos días escudillándolo, buenísimo!! Lo ame 💗 . Hay tanto que aprender. Mil gracias desde Venezuela profe.

[@jonmircha]

;)

[@ivantg4572]

vos pareces de otro planeta ome como explicas nada que ver con tanto curso que hay en youtube sos el mago del desarrollo web en youtube sos tan mago que los que hemos descubierto tu canal tenemos una reliquia en la vista

[@jonmircha]

😉👋🏻

[@seica5561]

Excelente Curso.. y todos los tips de CSS para este ejercicio.. Desde San Antonio de Los Altos. Estado Miranda. Venezuela.. (13/07/2020)

[@davidavellaneda133]

Aquí les dejo la solución del ejercicio de menú hamburguesa con pequeños detalles como por ejemplo cuando le den click a un enlace el menú desaparezca, más no que si le dan al contendor de esos link, es decir toda la caja negra en cualquier parte desaparezca, espero entiendan este código codepen.io/david-avellaneda-git/pen/gOWGLOe MENÚ HAMBURGUESA Aquí se encuentran los mismos ejercicios pero con código original en algunas partes david-avellaneda-git.github.io/ejercicios-DOM/ Este profe es el mejor, me encuentro muy feliz porque gracias Jon Mircha he desarrollado poco a poco esa lógica de programación, y cada vez se me hace más fácil encontrar o solucionar errores, gracias profe

[@jonmircha]

👍🏻

[@RonnyG2121]

actualiza esos enlaces que no funcionan

[@pgm3100]

Estimado Jon, he puesto el botón arriba, salvo en tamaño móvil, creo que queda mejor. Es una tontería, pero para mi es una forma de agradecer tu inmenso trabajo. @media (min-width: 576px) { .panel-btn{ top: 1vh; } }

[@jonmircha]

👋🏻😉

[@lorenatarnovsky5725]

Gracias a Dios y a ti pude hacer mi tarea. Muchas gracias y sigue adelante enseñando.

[@jonmircha]

Hola, muchas gracias👋🏻😉

[@manuelcobasguerra5688]

Mil Gracias Por Este Y TODOS Los Videos de este maravilloso curso en el cual e aprendido muchisimo Eres Un Gran Profesor MIL GRACIAS!!!!

[@ZephyXanthe]

(42:20) Tambien podeis usar ------pointer-events: none; ------ en el hamburgher-box (o sea el contenedor span que tiene las lineas del hamburgher) haciendo que el evento solo se asigen al panel-btn.

[@jonmircha]

👋🏻😉

[@RoyArrascaeta]

Increíble la cantidad de cosas que aprendí viendo este video. Sobre todo de CSS, admito que me he quedado un poco atrasado con su alcance y la verdad me sorprendió mucho todas las cosas que se pueden hacer con algunas propiedades que no conocía. Así que por mi parte, muy agradecido por la duración del video ya que sirvió de repaso + nuevas características de html y css, y obviamente la implementación de javascript en un contexto "real" ya dejando de lado los ejercicios de lógica.

[@jonmircha]

:) Que bueno que te sirvió, ayúdame a llegar a más gente, compartiendo

[@mikepimento]

La parte del botón con JavaScript lo resolví así... Sencillo y funcional, a menos que haya algo mal😅 const panelBtn = document.querySelector(".panel-btn"), panel = document.querySelector(".panel"); panelBtn.addEventListener("click", () => { panel.classList.toggle("is-active"); })

[@jonmircha]

👍🏻

[@jorgeisaacgarzonalfaro2957]

Muchas gracias, Jhon! Es invaluable la forma en que compartes tu conocimiento. No solamente con javaScript, sino también con HTML y CSS. De verdad, muchas gracias!!

[@jonmircha]

😉👍🏻

[@giovannyvanegas88]

Hice la solucion mas simple y de otra forma usando JS, pero aqui se ve bastante conocimiento y que nos falta practicar mucho. Excelente video profe Jon

[@jonmircha]

👋🏻😉

[@enoccastro9355]

Muestra el código para aprender

[@carlosfelipe-x2l]

apenas lo veré pero con un revisado por encima se nota la calidad y el empeño, listo para seguir aprendiendo, esto no se detiene, eres el mejor!

[@jonmircha]

👋🏻😉

[@JuanDGamba]

36:20 El editor VS Code coloca automáticamente el import si detecta el archivo. 39:28 El problema del botón es que no detecta el evento si está dándole clic al span (las líneas), me di cuenta casi inmediatamente XD. Excelente explicación.

[@jonmircha]

👋🏻😉

[@vanhellsing3029]

abueno master

[@yanluisnunezlara319]

Los tips que html y CSS que va dando son oro. Me refresca la memoria y aprendo nuevas cosas

[@jonmircha]

👋🏻😉

[@luciogames2488]

ya quiero llegar a programas con la facilidad que lo haces y los detalles que haces tremendo crack

[@jonmircha]

😉👌🏻

[@darx9050]

WOOOOOOW.... Eres el Dr. Strange de la web por la magia que tienes tanto para manejar la programacion como para ensenar..., muchas gracias por todo Jhon, siempre comparto tu contenido.

[@jonmircha]

😉🙌🏻

[@Black_Coding]

Genial solución, yo lo había hecho con css como explicaste en otro video xD, dejé los 2 botones para tener referencias. Me gusta que ahora apliquemos lo que aprendimos en las últimas clases asi no se vuelan de la cabeza. Muchas gracias, a seguir

[@jonmircha]

😉👋🏻

[@geografiaeducativa2727]

Muy completo 👍

[@jonmircha]

Gracias! 😊

[@geografiaeducativa2727]

@@jonmircha , saludos, seria muy útil que pudieras realizar un vídeo, sobre el uso de .svg , por ejemplo, realizar el menú de hamburguesa con este tipo de imagen y ver la diferencia, ventajas y desventajas de este tipo, versus el uso de invocaciones de link externos de librerías .js. Soy de los que opina que mientras el navegador de menos vueltas por el mundo funcionara mejor. En otras palabras que todo este dentro del mismo código interno.

[@srcuyo]

increible, tuve q hacerlo veia el video porque en mi primer intento crei que la idea era crear nuevos elementos e insetarlos en el html. Pero resulto ser puro css Gracias JON

[@jonmircha]

😉👋🏻

[@tongastonga22]

Muchas gracias Joon, estoy tratando de llegar al monto para comprar tu taller! no lo quites por favor!! y felicidades una vez mas por esos 20 años!

[@jonmircha]

👋🏻😉

[@PalestinianCode]

Jon gracias por la primera clase de practicas. Nota: para selecionar el padre de algun elemento como pasa en el Hamburger, la solucion es el metodo: closest(). Para el autocompletado es la extension TABNINE

[@jonmircha]

😉👍🏻

[@kevinnunez8490]

Definitivamente antes continuar con el curso hare el curso de html, y css que este gran servidor también ha brindado

[@jonmircha]

👋🏻😉

[@mayonesa3492]

mil gracias,iba a empezar con esto pero primero me veo todso los videos de CSS y html q tenes mejor

[@jonmircha]

😉👍🏻

[@Juicio87]

Ejercicio resuelto, como me imaginaba lo que más me ha costado es el maldito css ; no sé utilizar bien los position relative y absolute ya que quería hacer un border radius en el botón hamburguesa como lo tenías tú y centrado pero estaba perdiendo mucho tiempo con eso; tengo pendiente meterme en tus cursos de css porque estoy seguro que voy a aprender una barbaridad. No sabía que se podía meter nombres de clases como argumentos en las funciones...me he quedado loquísimo xD

[@jonmircha]

👋🏻😅

[@carlosjavierorozco8418]

Gran Ejercicio pude completarlo. Muchas gracias!

[@jonmircha]

Excelente!

[@JDev-mj8pq]

El PUTO AMO!

[@jonmircha]

🙈

[@levialviter2302]

Una de las clases que más he disfrutado

[@jonmircha]

😮

[@sathonyNakamotolml]

Que buen video profe, aprendí demasiado, de hecho aprendí Js y Doom por agregar un menú hamburguesa a mi página web estática. 10/10

[@jonmircha]

👋🏻😉

[@MAJIXUX]

Gracias!!

[@jonmircha]

👋🏻😉

[@davidm.8835]

Excelente ejercicio ! Seguramente algunos pensaron, pues un botón hamburguer es relativamente sencillo.... pero siempre se aprenden detalles muy valiosos en tus tutos. Se nota que disfrutas con lo que haces. Gracias.

[@jonmircha]

De nada, sí lo disfruto mucho 🤓💛

[@Wiiiiizard]

🧙‍♂Muchas graciasss!!!

[@jonmircha]

👋🏻

[@timawid]

Muy buen video ✅⚡️

[@jonmircha]

Gracias!

[@MariaArias-uy2bi]

Hola Jon muchas gracias por estos grandes aportes pensando en los principiantes. En la exportación me aparece este error: Se esperaba una declaración o una instrucción.ts (1128) justamente en el penúltimo corchete, revise varias veces todo el código y esta todo en su lugar

[@johnherrera5913]

Master! Maravilloso trabajo. Tú explicación, excelente. Gracias

[@jonmircha]

😉🙌🏻

[@edgarzambrano3505]

excelente profe ,me gusto mucho el ejercicio

[@jonmircha]

Excelente

[@jurrrgenOF]

al fin pude arreglar mi problema espero arreglar los demás, buen vídeo

[@jonmircha]

😉👍🏻

[@marcosdanielromerogarcia-fx1kf]

Clase maestra para comenzar a practicar los eventos en js

[@jonmircha]

👋🏻😉

[@kevyyar]

No sabia que se podia poner clases de css como string como argumentos dentro de una funcion. Excelente ejercicio!

[@jonmircha]

😉

[@Bisson156]

Increible Jon, muchas muchas gracias! La forma en la cual enseñas es espectacular y muy entretenida. Aprendo muchisimo de tus videos y de tu profesionalismo. Saludos

[@jonmircha]

😉👍🏻

[@notfriki]

Genio profesor, un saludo desde Nicaragua!!

[@jonmircha]

Gracias! Saludos!

[@tami379]

Muchas gracias por compartir tus conocimientos, sos muy bueno enseñando.

[@jonmircha]

😉👍🏻

[@EducacionCultura1992]

Profe es realmente muy valioso lo que haces, agradezco esa dedicacion , seguro me convertire en un excelente desarrolador. Solo me quedo una duda con la expirtacion he importacion de los modulos. Estoy trabajando todo desde el archivo index_dom.js porque no he podido enlazar los modulos. Si tengo todos los archivos a la misma altura en la misma carpeta debo solo enlazarlos con en nombre del archivo o deben de llevar la barra invertido al inicio ?. Gracias

[@angelabrahamlopezdelgado7574]

Gracias a como funciona el css el javascript ya es facil, Mi buen amigo Jon gracias por enseñarme css

[@jonmircha]

Con mucho gusto

[@vegaimagen9075]

Gracias Jon..y vamos por la segunda vista de este video, me confundi un poco con js pero ahi voy

[@jonmircha]

Excelente :)

[@GerentedeSistemas]

Jon, esperaba full ejercicios javascript, sin embargo he aprendido tanto en un solo tema de CSS que valió la pena.

[@jonmircha]

😎👌

[@gustavokuster8989]

Hola Jon, gracias por tu trabajo...Que piensas de colocar el en el head, con defer....???

[@braianrico4422]

Yo solucionando un problema durante 4 horas y aparentemente era una letra mal puesta jajaja. Lo bueno es que de cada error se aprende jajajaja Jon mil gracias, bendiciones!!! 🧙‍♂️🧙‍♂️🧙‍♂️

[@jonmircha]

🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻 Suele pasar

[@braianrico4422]

@@jonmircha Jon te queria hacer una consulta, en algún video usted especifico que debiamos de utilizar live server... la pregunta es: si ejecutando el archivo index.html desde el servidor directamente debe de tener el mismo comportamiento que al ejecutarlo con live server? Quedo atento y mil gracias, bendiciones !!!!

[@facundocordoba4033]

@@braianrico4422 tenes que copiar tanto el documento html, el css y los js. podes probar usando xammp y veras que te muestra el contenido de igual forma que usando live server Saludos

[@josefabianbeltranmeza6914]

¡Disfruto de cada video!. Muchas gracias Jon

[@jonmircha]

Gracias a ti!

[@maicodiaz7487]

SOS INCREIBLE!!!!!

[@federicoraulmaciasaparicio1339]

Hola. Por desgracia no me dio tiempo de intentar el menú de hamburguesa antes de su emisión en directo, pero el ejercicio fue muy bueno y las soluciones que se aportaron también estaban bastante bien. Dejo aquí el código de un reloj digital en JavaScript que se corresponde al siguiente ejercicio. Sé que no es exactamente igual a lo que se va a hacer en clase, pero creo que parte del código JavaScript se puede aprovechar al menos. codepen.io/Scipio14/pen/XWmveZa

[@jonmircha]

Muy bien :)

[@ronalddavidhernandezpadill8182]

A mi tambien ma paso lo mismo con las lineas del boton de navgacion y lo solucione con el operador II en micaso yo hice el boton de forma artesanal con puro css y con las divs hice las barras

[@colommbiano]

Muchas gracias maestro por este gran ejercicio super útil. siempre quise aprender a crear mi propio menú hamburguesa personalizado y gracias a usted lo aprendí. compartiré este vídeo con otros amigos saludos 👍

[@jonmircha]

Excelente :)

[@nataliahilarion426]

Wow! me encanto la clase, aprendí mucho, muchas gracias :)

[@jonmircha]

Con mucho gusto

[@alannm5414]

Aprendí un montón de cosas nuevas en este video, lo de poner el botón de hamburguesa en la parte de abajo nunca de me había ocurrido

[@jonmircha]

😉👍🏻

[@carlesbautista8293]

Perfecto Jonathan,voy a ello, muchas gracias, he aprendido un poco mas del HTML y CSS con este video, aun no veo claro lo de la importacion de la funcion, pero poco a poco a ver..Gracias por tu tiempo :)

[@jonmircha]

Mucha suerte!

[@walterjosesuarezdelacruz1495]

bien ahora que veo el vídeo por segunda vez y haber hecho varias anotaciones en el código, voy a cambiarle el nombre a algunas variables, voy a ponerles uno bien explicito para que cuando lo lea de nuevo y quiera hacerlo solo se me sea mas fácil recordar jeje. Muy buen curso JON.

[@jonmircha]

:)

[@baironguerra5405]

gracias, excelente

[@jonmircha]

A la orden

[@luchogrz273]

Hice paso a paso todo lo que Jon venia explicando. Lo entiendo y lo aplico. Lo pruebo y no funciona. Horas buscando que hice mal. vi todo de nuevo y nada. Finalmente el documento index.js estaba mal linkeado en el script de html :)

[@jonmircha]

🫢

[@nihil_um]

Con respecto al problema de la delegación de eventos... Se puede dar el caso contrario al que te ha sucedido a ti y es que tu quieras hacer clic en un elemento interno del botón (bien porque necesites capturar un atributo data o lo que sea) y no detecta ese elemento interno porque solo detecta elementos que esten por encima. Cómo resolvemos eso?. Lo que yo suelo hacer es, mediante css, asignar la propiedad pointer-events: none; al elemento que me está capturando el clic y me molesta, pero no sé si es lo correcto o no... Qué recomiendas tú, jon?. Un saludo y enhorabuena por el curso.

[@jonmircha]

Es una buena opción :)

[@eliam9461]

Jaja que buena! Tenia ese problema que el div capturaba el evento. Gracias Nihil!

[@henochernandez43]

Excelente video

[@jonmircha]

Gracias!

[@elmirador7097]

Genial !!! Increible tu contenido !!! lo unico que por ahi no me gusto en este ejercicio es que al al tener el evento en el document me queda todo el documento reactivo al evento click si pongo un consol.log dentro del listener el documento entero me esta reaccionando al click ... la verdad que me viene a la cabeza pensar si es un problema o no ? o un detalle insignificante ... pero la verdad Fantastico contenido !

[@jonmircha]

NO debería para eso sólo desencadenamos la programación en los selectores necesarios para eso es e.target.matches

[@heferh4320]

yo habia hecho el botón con y border black para las lineas y no me funcionaba del todo, era por el elemento interno xd y la transición la hice muy chafa pero bueno (a leer documentacion y ver el video 3 veces)

[@jonmircha]

👍🏻

[@alexherrerar1891]

muy buen video, muchas gracias por tan buenos videos. consulta para react como seria los menu hamburguesas?

[@aviellisandrovasquezreyes1172]

gracias muchas muchas gracias

[@jonmircha]

😉👍🏻

[@monsterleagueescritas]

Estoy apunto de empezar los ejercicios 💪 😃

[@jonmircha]

😉👋🏻suerte

[@kikemadrigalr]

Genial.. Se abren las posibilidades de mejora para mi propia solución después de ver este vídeo. Me quedo la duda, como validad un selector valido?? Saludos crack..Voy con lo que sigue..

[@jonmircha]

Con el método matches

[@emersonpalaciootalvaro2632]

super parcero, muy bien gracias.

[@photosintesis5420]

Y yo qué pensaba qué sabia CCS 😂😂

[@euronymous_]

la ironía del comentario es simplemente perfecta jajajaja

[@juniorvargas9047]

Me identifico hahaha

[@frenchifrenchi6438]

Sí, pocas veces en la vida me he sentido tan humillado...

[@josechambi7483]

=(

[@walterjosesuarezdelacruz1495]

bueno pondré en pausa este curso y miraré tu curso de flexbox, porque aunque ya había visto un curso de CSS en otro canal, en este vídeo he visto características que nunca había visto. Buen vídeo

[@jonmircha]

:)

[@luisluna8900]

gracias jon por todo hasta ahora, aun me falta por entender mejor, por ejemplo por que el * con las backticks con los links

[@jonmircha]

😉👋🏻

[@seica5561]

Jon.. A que te refieres cuando dices "Selectores válidos".. es lo que colocaste como parámetros de la función menu_hamburger.js..Gracias..Antonio de Los Altos. Estado Miranda. Venezuela.. (14/07/2020)

[@jonmircha]

Un selector es cualquier elemento al que le puede aplicar una regla CSS como un id, una etiqueta, una clase, o una combinación de estos

[@carloscabi]

segun yo, ya estaba un poco introducido a CSS, pero esto, ni idea; nos queda un largo camino en este mundo. 6/6/2022

[@jonmircha]

😉👍🏻

[@sebastiansanchez1384]

te quiero mucho jon

[@jonmircha]

👋🏻😉

[@mikepimento]

49:32 Si usamos solo opacity para aparecer y desaparecer el panel, el panel sigue en pantalla aunque no lo veamos y causa problemas al hacer click arriba.

[@jhojansmithvelezgomez5601]

Jon, fue tan enriquecedor y entretenido el vídeo que me pareció de 15 minutos jajajaja

[@jonmircha]

;)

[@gabrielperdomo9329]

hola Jon. no pude cambiarle el background-color al boton. cambia de posicion pero cambia de color por un micro segundo y luego se queda blanco...??? se te ocurre alguna cosa que hice mal? gracias de todos modos.

[@gabrielperdomo9329]

Encontré la solución. había puesto primero el link de la hoja de estilo css y despues el link al cdn de la hamburgesa.Cambie el orden y listo .

[@jn-olmos]

@@gabrielperdomo9329 Ademas eso se da porque el Hamburger Menu por default trae el background-color en transparente. Puedes cambiarlo en su propio archivo css.

[@humbertoantoniogarciarojas5150]

John Eres lo maximo 🔥👋 bro

[@jonmircha]

:)

[@evalaya3832]

gracias profesor de verdad todos sus videos son muy buenos ....yo voy por el 103 ...pero me devolví porque dejo de servir la librería cosa que funcionaba bien ....pero soy de Venezuela y si a visto noticia ...estamos en dictadura pura y dura ....de la que si estas en la calle o en una plaza te piden el celular o móvil y si tiene algo que no les gusten te llevan preso por 8 años de cárcel...y están manipulando el servidor de Venezuela...y por eso creo que no funciona ...porque la verdad no creo que ahora valla a aparecer un error después de tanto tiempo 🥲 ... tendré que usar un VPN pero el gobierno a deshabilitados la gran mayoría 🥲... se que no es su problema ...solo estoy deprimida e estudiado mucho y me esforzado mucho para llegar aquí y es triste que me lo quieran quitar...gracias profe es usted de los mejores

[@jonmircha]

Mucho ánimo 😢🙌🏻❤️

[@andresteixeira1496]

¡Jon excelente! Te confieso que para este ejercicio use más JavaScript que CSS. Estoy muy contento con el avance que he tenido en estos meses viendo tus clases, también sigo tu curso de NodeJS. Tengo una duda sobre el curso de NodeJS, al inicio recomiendas que se tenga conocimientos en AJAX, se que después de los ejercicios del DOM vienen las clases de AJAX ¿Terminó primero las clases de AJAX para continuar con el Curso de NodeJS? Saludos, te mando un fuerte abrazo.

[@jonmircha]

Sí te sugiero primero entender AJAX antes de pasar a Node, saludos

[@giormr_heks]

En verdad muchas gracias por el tiempo que dedicas a estos cursos, desafortunadamente apenas empiezo en el maravilloso mundo de la programacion, una duda, aunque el codigo funciona bien en VS da el warning "Validation(CSS 4.0): scroll-behavior is not a known CSS property name", aunque aun asi funciona bien el smooth scrolling, a que se debe?

[@helipalacio8772]

👏🏻👏🏻👏🏻 🙏🏻🙏🏻🙏🏻

[@jonmircha]

👋🏻😉

[@cristianandresbuitragosuar8768]

Muchas gracias por todo el conocimiento, el contenido es excelente. En este video necesito ayuda, no sé si a la fecha se ha actualizado algo de la sintaxis para hacer referencia a todos los elementos hijo del elemento padre (`${panelBtn}*`) porque al hacer click en el centro de la hamburguesa me arroja error.

[@emanuelr9815]

Ufff excelente explicación gracias

[@jonmircha]

A la orden

[@matiasromera330]

buenisimo!

[@jonmircha]

😉

[@moronsantiago]

Profe, una consulta (quizás ya la hicieron en algún otro comentario de los 517 que hay a la fecha). Hay alguna razón específica para no utilizar el mismo toggle (agregando otra condición en el if) en vez de remover las clases cuando doy click en un enlace? (Lo he probado y funciona). Gracias!

[@jonmircha]

Es otra forma de resolver el ejercicio, recuerda que siempre por lo menos hay 2 formas distintas de resolver un problema ;)

[@thejb9902]

Es mucho el mundo que queda por ver aparte de JS. CSS Y HTML se me fue un poco complicado seguirte por lo mismo. En mi caso tuve 2 implementaciones del menu hamburguesa. en este caso jugando con la propiedad display de manera dinamica con javascript

[@jonmircha]

👍🏻

[@resumenalacarta4778]

Hola jon. Una consulta. Porque es becesario ejecutar la funcion en el DOMContentLoader? Muchas gracias

[@jonmircha]

Es lo correcto, en el momento en el que el DOM esta listo, pero también podrías autoejecutar tus funciones

[@juanignacioveliz6745]

Jon, no sé si ya existe un canal de discord, donde podamos sumarnos todos los que estamos aprendiendo tus cursos, ya que es algo que uno nunca termina de aprender y muy colaborativo el mundo de la programación, creo que puede ser de mucha utilidad .

[@jonmircha]

discord.gg/gPgJMUF

[@paulpaucarb]

jon al minuto 9:33s te confundiste por que a los link no le pusiste # Sección 1 Sección 2 Sección 3 Sección 4 Sección 5

[@jonmircha]

:P

[@raymeralexander4717]

Tengo una duda con el evento DOMContentLoaded, se que este se ejecuta cuando el documento HTML se ha cargado. Lo que me causa la duda es las funciones que se ejecutan dentro, por ejemplo la de la hamburgerMenu, porque la función hamburgerMenu se sigue ejecutando cuando la pagina ya ha cargado? no debería de ejecutarse una sola vez? será que porque estamos interactuando con el DOM la pagina se vuelve a cargar cuando detecta un mínimo cambio en el documento? Saludos desde la Republica Dominicana!

[@jonmircha]

No, es cuando carga el HTML, sino cuando el DOM esta listo para interactuar con los elementos HTML

[@carloscontreras6051]

Jon, consulta, puede ser que si se trabaja sólo con la opacity, sin translate, haya que darle visibility:hidden al menú y visibility:visible en el .is-active? Me paso que aunque no se veían los links, seguían funcionando dándoles solo opacity 0

[@jonmircha]

si o desactiva la propiedad pointer-events

[@paulpaucarb]

feliz navidad jon pasala muy bien con tu familia :D

[@jonmircha]

igualmente :)

[@gabrielvis-brawlstars1568]

Profesor, tengo un problema con la hoja de estilo de la hamburguesa . min y es que sobrescribe algunos formatos de mi css, como puedo hacer para sobrescribirlos ?

[@jonmircha]

Pon tu hoja de estilo antes de la tuya

[@gabrielvis-brawlstars1568]

@@jonmircha gracias