MODAL APENAS COM HTML - Crie um pop up completo somente com HTML e uma pitada de JS (tag dialog)

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ก.พ. 2025

ความคิดเห็น •

  • @MatheusBattisti
    @MatheusBattisti  9 หลายเดือนก่อน

    🔴 Curso completo de HTML e CSS: app.horadecodar.com.br/ebookpages/boas-praticas-html-e-css
    📘 Ebook de HTML e CSS grauito: app.horadecodar.com.br/ebookpages/boas-praticas-html-e-css

  • @junnyhor
    @junnyhor 9 หลายเดือนก่อน +14

    Matheus, queria te agradecer pelas aulas, tanto daqui quanto da Udemy. Graças as suas aulas, eu consegui um trabalho, aliás um ótimo trabalho. Vou continuar seguindo aulas como essas e outras que virão. Abraço!

    • @MatheusBattisti
      @MatheusBattisti  9 หลายเดือนก่อน +1

      shooow, mto massa mesmo, obrigado pelo comentário! =D

    • @DominguesMauroo
      @DominguesMauroo 8 หลายเดือนก่อน +1

      Pooo irmão, parabéns de verdade!!! Nem te conheço mas fiquei feliz pra carai lendo essa msg.
      Os cursos do Matheus são mt bons, didática boa, sem contar que os projetos são bem legais

  • @ramonb8085
    @ramonb8085 8 หลายเดือนก่อน +1

    Dica top Matheus, já fui seu aluno e continuo seguindo as dicas! Testei aqui e realmente é bem prático. Pra resolver o problema de fechar, uma outra alternativa que usei foi zerar o padding do dialog que vem como padrão em 1em e daí coloquei padding nos elementos internos.

  • @AbusarWeb
    @AbusarWeb 9 หลายเดือนก่อน +1

    Ótica dica Matheus. Parabéns! Essa tag ajuda bastante e facilita a criação do modal.

  • @eduardogomes579
    @eduardogomes579 8 หลายเดือนก่อน

    Boas dicas, muito obrigado !

  • @elsonsantos9968
    @elsonsantos9968 9 หลายเดือนก่อน +2

    Estou criando um projeto, isto vai me ajudar.

  • @nicolasalmeida7673
    @nicolasalmeida7673 9 หลายเดือนก่อน +1

    Esse Matheus é muito fera.

  • @dcassis
    @dcassis 9 หลายเดือนก่อน +1

    Ótima dica!

  • @DiogoScarmagnani
    @DiogoScarmagnani 9 หลายเดือนก่อน +1

    Muito legal o dialog, é uma das ferramentas nativas q mais gosto no HTML.
    Uma coisa q pode fazer dar certo fechar o modal usando o e.target ao invés do getBoundingClientRect seria setando a margem, borda e padding do dialog para 0 e dentro do dialog colocar uma div que terá height e width 100%, com isso cobrirá todo o dialog (com exceção do backdrop) e todo clique dento do dialog por consequência o e.target será a div (ou seus filhos).

    • @yuri4dev
      @yuri4dev 6 หลายเดือนก่อน

      isso faria fechar o modal clicando do lado de fora?

  • @lindom4rs4bino89
    @lindom4rs4bino89 8 หลายเดือนก่อน +1

    Perfeito seus video amigo, apredendo um basico, so por roby. aida em html,css,javasclipt.

  • @oxum1983
    @oxum1983 9 หลายเดือนก่อน +1

    Matheus muito bom. Qdo eu clico na parte de baixo não fecha, pode testar o seu código para ver se fecha?
    Pq fiz igual ao seu.

    • @MatheusBattisti
      @MatheusBattisti  9 หลายเดือนก่อน

      Vê se foi algo errado ali nas coordenadas, não consigo testar agora hehe

    • @comentariosreview
      @comentariosreview 9 หลายเดือนก่อน

      Colocou o botão com o id certo? Na hora de chamar ele em uma var ou constante verificou se está correto? Tenta fazer alguma alteração com ele pelo JS pra ver se é só esse de fechar que não funciona.

  • @jujuwitzke
    @jujuwitzke 3 หลายเดือนก่อน

    Por que precisamos adicionar o type button se já usamos a tag button, o type não é identificado automaticamente?

  • @eduardogomes579
    @eduardogomes579 8 หลายเดือนก่อน

    Boa noite, queria saber o porquê o (e) esta entre parênteses ?

  • @jujuwitzke
    @jujuwitzke 3 หลายเดือนก่อน

    O correto não seria deixar o botao de fechar o modal fora do form?

  • @hailtonDavidLemos
    @hailtonDavidLemos 9 หลายเดือนก่อน +1

    Matheus, é possível disponibilizar o código deste vídeo, ajuda muito!

    • @MatheusBattisti
      @MatheusBattisti  9 หลายเดือนก่อน

      cara, acabei não criando repo, vou anotar aqui para subir, aí ponho na descricao nos proxs dias, abraço!

    • @hailtonDavidLemos
      @hailtonDavidLemos 9 หลายเดือนก่อน

      @@MatheusBattisti Obrigado!