Menu Responsivo | HTML, CSS e JAVASCRIPT

[@b.soares545]

Adorei o vídeo, para quem ficou com dúvida assim como eu quanto a class .'open' criada no arquivo CSS, você colocou display: block dentro desta class .open, que foi o mesmo padrão estabelecido nas condições do @media screen para mobile quando o navegador quebrar para 730px, ele entra na div class. mobile-menu-icon, no html, que configura para display: block, assim como está estabelecido no arquivo style.css. Não sei se minha explicação está muito clara, mas foi isso que entendi da leitura do seu código. Continuei postando mais vídeos, ajudou muito.

[@deosdetedeo8272]

Este video é importante. Depois de ver um monte de conteudo na internet sem conseguir exito com meu projeto, tendo na maior parte dos problemas conflito com os atributos.... Cheguei no seu video e pude entender o uso dos recursos do CSS em conjunto com javascript. Muito obrigado. Top😍

[@jilmarsantos]

Você foi fantástica explicando. Vou ficar por aqui, nesse canal. Continue com seus vídeos.

[@PauloBastospaulo_bastos]

Bom dia, boa tarde ou boa noite, Larissa! Em menos de 20 min ( e mesmo com sua pequena incerteza no final ), você esclareceu um problema que me atormentava há meses!! Parabéns pela aula! E agradeço pelo tempo em que se dispôs a criar e compartilhar esse conteúdo.

[@larissakich]

Muito obrigada 😊

[@isaque5811]

Que problema? Só fiquei curioso pra aprender tbm

[@PauloBastospaulo_bastos]

@@isaque5811 como era feito um menu responsivo. Assisti muitos vídeos no KZbin e não entendia até assistir esse. Porque ele fez bem passo a passo.

[@camilaleutz]

A sua empolgação no decorrer do vídeo é ótima! E você explica muito bem viu? Ja fiz outras aplicações com os seus videos e você apareceu como sugestão novamente! Obrigada!

[@brunoserraoliveira]

Ficou muito massa parabéns , não estou no seu nível , mas só de entender toda a explicação fico muito feliz . Obrigado Larissa .

[@MendelParadela]

Nossa, que aula! Aliás, todas as suas explicações são muito boas, muito didáticas! Obrigado pelos ensinamentos!

[@barezinho1421]

Parabéns com essas skills já pode se considerar uma DevJunior

[@antonyalbuquerque7736]

Sou o Júnior do aprendiz 😢

[@dionedomingues718]

Eu sou aprendiz do JR do aprendiz 😢

[@gilvanfilho728]

​​​@@dionedomingues718 Sou aprendiz do aprendiz do aprendiz do Jr😢

[@JoaoTankz]

eu sou o Juninho dos juniors aprendiz dos juniors

[@LucasBSilva-nj9gu]

Boa didatica kkkk mesmo sendo modesta, estou usando como exemplo no meu projeto pessoal, agradeço o conhecimento. Parabéns!!!

[@lmsdevop]

Excelente aula! Mudei toda minha construção do site para se adequar a esse menu e deu super certo! Muuuito obrigado :D

[@eduardolaux9976]

SENSACIONAL! Adaptei pra minha página profissional e ficou lindo!

[@ramonbatalha8687]

Muito bom! Passei a tarde assistindo vídeos sobre menu responsivo e esse foi o que melhor que encontrei.

[@larissakich]

Que booom, fico feliz em conseguir ajudar 😊

[@zinidtv]

Muito bom de maravilhoso esse vídeo, boa explicação e excelente prática para ensinar, ficou tudo muito claro!!! Continue com os vídeos!

[@teotoniaeduardo4180]

Muito obrigada. Estava na dúvida aonde inserir o else e o if. Muito obrigada. Parabéns

[@richardluis7976]

Mds, eu mal te conheço e já te amo, tu é incrivel mlk!

[@sabrinazimmerman5716]

bem basico, nada dificil demais, conteudo simples e bem explicado, parabens

[@moniquenavarro4131]

Vc explicou muito bem, e foram bem claras as instruções, esse conteúdo foi muito legal! ❤

[@larissakich]

Muito obrigada 😊

[@pablolimabahialima9382]

​@@larissakichei preciso de um profissional em css

[@larissakich]

@@pablolimabahialima9382 oii, entre em contato comigo por esse email: [e-mail]

[@joseluissantos1099]

Muitos parabéns Larissa , você continuando assim chega longe 😝 Muito obrigado pelo vídeo 🥰

[@larissakich]

Muito obrigadaaa❤️❤️

[@sergiolima8449]

Larissa ótima aula, uma dica seria usar "data atributos" para acessar o DOM no HTML para não usar os ID'S e as CLASS que são usadas no CSS e assim só olhando para código já sabemos que é um atributo usado no JS;

[@eletrotech51]

E como ficaria usando esse método?

[@imnothenry.]

Ao inves de fazer o uso da tag button, pode também usar a que economiza mais css, mas é besteira, belo tutorial

[@carlosalbertobritodesouza8843]

excelente Tuto, estava alguns dias tendo dificuldade com o close menu, vi seu tuto, resolvi.

[@larissakich]

Fico muito feliz em te ajudar ❤️

[@DanielDantas-br]

Parabéns, Larissa. Simples e objetivo.

[@larissakich]

Muito obrigada ❤️

[@atlas_bhz4556]

Ótimo vídeo Larissa, vim aqui colar de você! lol Você disse ali sobre a unidade rem, por padrão 1rem = 16px, por que? porque por padrão o HTML vem setado com font-size = 16px. Caso você mude o valor padrão do HTML em rem tbm vai ser modificado. Suponha-se um HTML que vc mudou o font-size dele pra 20px, agora 1rem = 20px, trocando em míudos 1 rem = 1*(O tamanho da fonte do seu HTML). Muito Obrigado por compartilhar esse contéudo com a comunidade!

[@larissakich]

Muiito obrigada por compartilhar essas informações ❤️❤️

[@brunosantanadev]

Era só definir um root { font-size: 16px} no css ou o valor que desejar e pronto 😁

[@eduardamanenti6301]

Olá! Só passando para agradecer! Seu vídeo me ajudou.

[@mfrancisco]

você é sensacional, eu queria usar um menu responsivo, porém, todos que eu fazia, ou achava na internet estava ficando complexos (muito code).. ai achei o seu, é simples, e muito compactado, eu peguei e editei algumas coisinhas pra ficar parecido com oque preciso... show de bola , obs: iniciei no mundo do html a 10 dias, acredito que estou indo bem, aprendendo super rápido as coisas.. (inclusive já arrisquei fazer um website pra uma empresa hihi)

[@larissakich]

Oii, fico muito feliz em ter te ajudado, muito sucesso na sua jornada ☺️

[@le__marim]

Didática envolvente, parabéns 👏🏼👏🏼👏🏼

[@larissakich]

Muito obrigada 😄

[@douglasmatos2134]

gostei muito do vídeo, estou iniciando na programação e o js esta sendo um pouco complicado de compreender algumas sintaxes, me perdi um pouco no css, pois não lembrava de cabeça as class que vc tinha colocado, acho q ficaria muitoooo melhor de coloca-se o live server no canto da tela e dividisse entre o live server e o vs code. Ia melhorar muito a compreensão e tbm poderia ficar fácil de uma pessoa q ainda menos experiencia q eu entender o que vc quer passar. Vídeo ficou muito bom parabéns! vou começar a companhas as dicas

[@larissakich]

Oii, muito obrigada pelo feedback, comecei a fazer os vídeos só com a tela dividida agora

[@leeprogramador]

Muito top. uma dúvida... como fazer para fechar o botão quando clicar nos links?

[@viniciuspereira2734]

Mec eu fiz 2 tutoriais disso e só no seu eu vi que tbm não havia habilitado o JS. kkkkkkkkkkkkkkk. Me ajudou muito.

[@larissakich]

Oii, fico feliz que tenha conseguido

[@hyouka7754]

Outro vídeo maravilhoso Larissa, parabéns!

[@leandrolemes3342]

Parabéns Larissa, muito bom, você é excelente.

[@tvpanoramalavrense]

Parabéns, Larissa, pelo trabalho desenvolvido! Sucesso! Tens um futuro brilhante!

[@larissakich]

Muito obrigada! ☺️❤️

[@olhaaiprofessor]

Muito bom! Larissa. Adorei sua aula, Parabéns pelo o canal.

[@larissakich]

Muito obrigadaaa, que bom que gostou ☺️😄

[@userUndefined404]

Muito bacana, estou montando um time de desenvolvedores e eles estão engatilhado, vou compartilhar seu conteúdo pra eles vai ajudar muito.

[@larissakich]

Que show! Muito obrigada, espero que eu consiga ajudá-los 😊

[@romulomagalhaes1895]

Simplesmente INCRÍVEL, seu conhecimento de front-end pelo que eu vi só nesse vídeo é muito vasto, faz até parecer fácil. Como você aprendeu HTML, CSS e JS?

[@larissakich]

Oii muito obrigadaa, eu fiz alguns cursos, indico bastante o b7web e os cursos da Alura

[@esleyleal9385]

@@larissakich Larissa , como posso entrar em contato contigo pra tirar algumas dúvidas , quando o assunto é responsividade acabo ficando um pouco fechado. Comprei o curso da B7Web também

[@DavidSilva-cm4ni]

Parabéns Larissa, ótimo conteúdo e bem objetivo. Você vai longe!! Ganhou mais um inscrito.

[@larissamendesdaily]

Parabéns lariiii amei de mais seus vídeos, não pare 💜

[@larissakich]

Aaaaa muito obrigada, isso me motiva muito ❤️

[@Lucas-di6hb]

Obrigado por compartilhar seu conhecimento com agente Larissa. Mais um inscrito! Você é autodidata ou fez algum curso de programação?

[@larissakich]

Oii, muito obrigadaaa😊, eu estou fazendo alguns cursos.

[@Lucas-di6hb]

@@larissakich Ah legal, sucesso!

[@vdzinn9964]

@Jonas Nascimento Eu fiz, é muito boa as aulas dele.

[@FernandoAugustoNegriniMartins]

Muito bom , simples e direto ao ponto. Justo o que eu precisava

[@eduardocapela9884]

Parabéns pelo video! O menu ficou excelente!! Estou adaptando para criar um template no wordpress com esse menu. Porém, o caminho para o arquivo svg precisa ser dinâmico. Sabe se é possível utilizar código php dentro do arquivo js? ou entao... fazer de alguma forma que o caminho do arquivo não fique dentro do arquivo js...

[@drikaguedess]

Parabénss!! Eu testando esse menu de vários videos, só o seu funcionou!!! Ai Simmmm!!!!

[@planob9201]

Muito bom me ajudou bastante tava querendo fazer na "mao" e da forma que vc fez ficou show !!! Continua!!!

[@marcosfonseca5247]

Show... maravilha de explicação. Deus Abençoe!!! Me ajudou muito!

[@larissakich]

Muito obrigada, fico feliz em ter ajudado ❤️

[@patriciodiniz5322]

Muito bom! hehe Ainda não manjo tanto assim, mas espero futuramente fazer um desse fácil assim. 😎🤝

[@larissakich]

No começo eu tive bastante dificuldade (ainda tenho), mas com o tempo você pega a prática, fico feliz que eu consiga te ajudar 😊

[@leandropqd]

No caso do JS, a função toggle não seria melhor do que usar os if/else's ?

[@lucasarneiro5625]

Parabens pelo tutorial, bem legal! Como pego os arquivos .svg? N consigo baixar do GitHub

[@alissontomazelli]

Muito top. Obrigado por compartilhar.

[@paulojorge59]

video muito explicativo e muito bom de ver obrigado por trazer esse projecto para gente.

[@adairtecnicoeminformaticae8364]

Nota 10 pra essa aula

[@williansaud4570]

@larissakich se caso eu querer colocar uma animação quando a foto do menu fosse trocada por causa do tamanho, eu teria que estilizar pela class icon mesmo? Apenas uma dúvida de principiante

[@fernandocalabria2029]

Show de bola só tenho uma dúvida eu consigo fazer página web designer mas não consigo enviar as imagens da página como faço obrigado as imagens saem em branco

[@Matheus-q1v8i]

Muito obrigado pelo vídeo !! me ajudou muito. Muito sucesso !

[@RomeritoCampos]

Parabéns! Excelente vídeo.

[@tchipolo14]

O que você fez me ajudou muito, obgd

[@joaovitoreds]

Muito obrigado pela ajuda larissa!

[@leandrorodrigues4414]

muito bom...mas poderia ter economizado mais linhas "de código " ..mas ficou top.. parabéns

[@OrnelasDev]

Gostei muito, vc explicou bem sim tá kkkk deu pra entender perfeitamente.

[@nandino]

Seus vídeos são muito bons, continue postando !

[@larissakich]

Muito obrigada 😊

[@ChrisG59]

Uma pergunta: sempre quando eu for criar alguma página responsiva, necessariamente eu vou ter que usar o "display:flex"? Vou procurar alguma aula sobre displays pra entender melhor...

[@SuperMarcioSp]

Muito bom vídeo, Parabéns

[@juniorkenmmasters]

Muito obrigado pela a aula meus parabéns sucesso aí pra ti \0/

[@rp-zangado]

Parabens Lari, muito bom :) INSCRITO!!!

[@larissakich]

Muito obrigadaaa❤️

[@washingtonnuness]

Muito top Larissa. Explicando direitinho. Será que tem uma série de JavaScript?

[@larissakich]

Oii, estou planejando fazer

[@aabi2k]

muito bom, gosto muito da tua didática

[@josecarlossilva7136]

Ótima explicação. Melhor impossível!

[@larissakich]

Muito obrigada, fico feliz que tenha gostado 😊

[@mateusandrade5469]

Parabéns , Ótimo material!

[@larissakich]

Muito obrigadaaa!!☺️

[@GustavoSantos-pc4iq]

Top Lari! Parabens.... Seria legal colocar agora o menu com sub itens tá?

[@lucasfelipe8349]

Muito Obrigado, eu estava precisando disso para colocar no meu site. E pensando em ideias de próximos vídeos, você poderia explicar a fazer posts, por exemplo de blog, horizontais?

[@larissakich]

Clarooo, posso fazer sim!

[@leobaestero8305]

Inscrito, ótimo conteúdo só sabia fazer com bootstrap, me ajudou muito!

[@gabrieljunior7538]

Muito bom o conteúdo.

[@ericodesenvolvedor9618]

Parabéns pelo video, ficou ótimo, pelas dicas e ótima explicação :)

[@larissakich]

Muito obrigadaaa, fico feliz que gostou ☺️

[@ericodesenvolvedor9618]

@@larissakich de nada :)

[@andersonfarias-c8w]

vc explica muito bem..

[@Criptomoedasbrasiill]

você é linda, eu te amo, ficou excelente esse video, melhor impossivel, estou me sentindo um engenheiro de software

[@coisasdofer6997]

ficou top! Parabéns! eu gostaria se possível que vc criasse um mini classificado de acordo com essa config desse vídeo!!!

[@erivaldoA]

Obrigado Larissa Kich😎. O seu Script foi útil para mim.

[@app2028]

Muito bom parabéns!

[@larissakich]

Valeuu, fico feliz que gostou 😄

[@app2028]

@@larissakich visitei seu Github e vi um projeto PHP que aí da não fez vídeo vai fazer né? :)

[@larissakich]

Aquele foi um projeto a parte que eu fiz tem um tempo já, mas vou dar uma olhada novamente nele (refazer e melhorar), e posso trazer um vídeo aqui no canal mostrando como eu fiz, mas acho que vai demorar um pouco até ficar pronto.

[@app2028]

@@larissakich eu trabalho com desenvolvimento já alguns anos e desenvolvo treinamentos online estou buscando parceria se quiser deixar seu e-mail

[@larissakich]

Claro, pode ser, me chama lá no insta: @lariikich, que eu te mando meu e-mail lá.

[@flayer2011]

sensacional!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

[@adamsinstrutor-tecnico484]

Boa tarde Larissa! Tentei adaptar aqui, só o botão amburguer que não aparece! No que posso ter errado ou que esteja faltando?

[@ricardolima6156]

Parabéns pelo conteúdo

[@larissakich]

Muito obrigada 😄

[@miguel-tv2cq]

que aula, muito obrigado

[@AiltonBarreto]

Obrigado pelo conteúdo, tem me ajudado bastante

[@renanmarchiqueiros4523]

show de bola, obrigado

[@cmservicossolucoes]

Parabéns, adaptando seu codigo ao meu projeto . 🤩

[@larissakich]

Muito obrigada ❤️

[@jilmarsantos]

Vídeo assitido e executado, deixei lá no seu direct. Obrigado!

[@gravastelo1498]

Excelente

[@DanieldeJesus-r8j]

mano sem enrolação direta e linda parabens, ganhou mais um inscrito rsrsrsrsrsrsrsrsrsrsrsrrs

[@1killer_fps]

como faz pra aparecer essa "régua" de dimensionamento? (12:49) excelente vídeo Larissa.

[@HenriqueDicasOficial]

ctrl + shift + i ... menu inspecionar do navegador

[@topfilmesply]

Muito facil, tambem faz tempo que eu desenvolvo

[@luiggiabdiel9345]

Muito bom, muito bom 👨‍💻

[@larissakich]

Muito obrigadaaa😊

[@jorgeteixeira9184]

Que vídeo massa, muito bom, apesar de achar que não ficou muito bem explicadinho sim ahahahah Parabéns, ganhou um inscrito! :)

[@larissakich]

Siim, eu vou tentar explicar melhor nos próximos, vou fazer com mais calma kskskd 😊

[@jorgeteixeira9184]

@@larissakich oi, eu escrevi errado. Ficou super explicadinho, você disse no vídeo não achar que tinha ficado ahahahahahah

[@larissakich]

@@jorgeteixeira9184 entendii, você escreveu certo sim, eu confundi sksksk😅

[@hendrioevandro6578]

Muito simples, Vlw pela ajuda.

[@josseanevendetti9307]

Oi querida! muito boa sua explicação! Tem como me dizer, talvez alguém saiba, como posso fazer um menu dropdown responssivel?

[@frases.motivacionais2023]

top didática muito boa !!!

[@larissakich]

Muito obrigadaaa ☺️

[@jrsitez1900]

gostei de aprender a fazer este menu, vc pretende continuar desta aula em diante, ex. contruindo um site ?

[@larissakich]

Oii, pretendo fazer uma landing page um dia

[@jrsitez1900]

@@larissakich legal fico aguardando esse dia

[@dmlgg4773]

Parabéns, como mudo a cor do menu_icon para preto????

[@finasterquem5720]

Vlw Larissa me ajudou demais!!!!!!!!!!! Muito obrigado!

[@wholetomy]

esse vídeo salvou a minha vida, obrigado

[@CalebeAlvesEvangelista]

Ta perfeito a aula, so tive que botar no 0.75 pra entender ksksksk

[@flayer2011]

Parabéns top de maisssssssssssssssssssssssssssssssssss

[@homemDeTernoOlhandoVoce]

parabens amiga, ajudou em meu projeto

[@larissakich]

Fico feliz em ajudar 😊