Janela Modal/ Pop-up com HTML, CSS e JavaScript

Подписаться 788

Просмотров 8 тыс.

50% 1

Aprenda a criar uma janela modal ou pop-up no seu site com HTML, CSS e JavaScript (sem precisar usar Bootstrap ou componentes de terceiros)
🌐 𝗟𝗶𝗻𝗸 𝗱𝗼 𝗲𝘅𝗲𝗿𝗰í𝗰𝗶𝗼 𝗻𝗼 𝗖𝗼𝗱𝗲𝗽𝗲𝗻: codepen.io/fecassa/pen/RwPyMYW
📖 𝗗𝗶𝗰𝗮𝘀 𝗱𝗲 𝗹𝗲𝗶𝘁𝘂𝗿𝗮 𝘀𝗼𝗯𝗿𝗲 𝗖𝗦𝗦 𝗲 𝗱𝗲𝘀𝗲𝗻𝘃𝗼𝗹𝘃𝗶𝗺𝗲𝗻𝘁𝗼 𝗿𝗲𝘀𝗽𝗼𝗻𝘀𝗶𝘃𝗼 (𝗹𝗶𝗻𝗸s 𝗱𝗲 𝗮𝗳𝗶𝗹𝗶𝗮𝗱𝗼)
fecassa.dev/livros-recomendados/
🛴 𝗠𝗶𝗻𝗵𝗮𝘀 𝗿𝗲𝗱𝗲𝘀 𝘀𝗼𝗰𝗶𝗮𝗶𝘀
Blog: fecassa.dev/
Twitter: / fecassabr
Instagram: / fecassa_dev
LinkedIn: / fernando-cassiano-dev
#css

Наука

Опубликовано:

4 июл 2021

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 32

@wesleydossantosgonsalves8016 Год назад

Que vídeo Sensacional !!!! Estou aprendendo HTML , Css e JavaScript para meu estágio. Aprender nesse formato “real-life” do programador , mostrando que todos erram durante o código é sensacional demais. Parabéns pelo vídeo

@MayaraValentin Год назад

Cara, muito obrigada pelo seu trabalho e pelo seu conhecimento! Você não sabe o quanto me ajudou com esse vídeo! Você é um ser humano útil à humanidade, continue assim!

@Headsup107 2 года назад

Bizarramente fácil de implementar! Obviamente, devido a ótima didática do Fecassa. Parabéns, dev! Ganhou mais um inscrito!

@bialauro9451 Год назад

cara tava com uma dor de cabeça pra conseguir fazer uma modal... salvou demais... muito obrigada!!!

@danielborges7918 2 года назад

comecei a te ouvir e com 10 segundos me inscrevi. Falou em demais

@marcelogamon85 3 года назад

Cara, muito obrigado!!! Seu código deu muito certo em um projeto que estou desenvolvendo.

@carmenlucia9896 2 года назад

Parabéns! Você de maneira simples explicou muito bem. Ganhou mais um inscrito. Gratidão pela sua aula👏

@Bastardovl Год назад

Implementei seu código no meu projeto(aliás, fiz tudo na mão, só depois vi seu codepen na descrição), só que eu precisava replicar por exemplo para três botões diferentes. Eu consegui fazer porém repeti as funções com nomes diferentes porque não sei ainda passar parâmetros.

@hemersonallan 2 года назад

Show de bola o video. Merece mil likes !!!

@lucasfigueiredo7380 2 года назад

você ensina muito bem! obrigado agilizou bastante e sem complicações

@PROJETOSOCIALCAPACITAR Год назад

muito proveitoso

@oambulantestore4626 2 года назад

muito bom o vídeo, parabéns pelo trabalho. Obrigado pelo seu conteúdo.

@RafaelSilva-vl8bh 3 года назад

Incrível como um pequeno botão leva mtas linhas de comandos kkk Mto bem explicado!

@fecassadev 3 года назад

Infelizmente eu me confundi um pouco na hora de escrever o JavaScript, mas o botão leva apenas duas linhas de código. Tentarei ser mais objetivo e breve nos próximos vídeos.

@Everaldobass 2 года назад

Excelente explicação..conteúdo top!

@silverjrbr 2 года назад

muito bom cara ajudou bastante

@washingtonnuness 2 года назад

Tá que pariu.. muito top.. obrigado.

@DiegoJFCampos Год назад

Visible nao funcionou comigo ai eu tive que colocar display none no modal e no show modal eu seto display flex.

@fecassadev Год назад

Hun, mudou alguma coisa no código? Ou será que é o navegador? Testou o código que deixei no codepen?

@pericleszacariasabrahao6913 2 года назад

Grande Fecassa, excelente aula! É possível fazer esse efeito modal chamando telas de cadastro distribuidas em outros arquivos html? Tipo uma arquivo cidade.php (cadastro de cidade). Tem algum modelo ou aula para exemplificar? Abraço

@fecassadev 2 года назад

Nos dias de hoje eu não recomendaria trabalhar com php para mostrar conteúdo no browser, prefiro usá-lo para construção de apis, em todo o caso basta a abrir a tags < ? Php ? > dentro da div e escrever seu código lá dentro ou incluir o arquivo php que vc quer executar. Só lembre que para visualizar o resultado, suas páginas terão de estar publicas em um servidor com php instalado

@silverjrbr 2 года назад

man eu fiz e nao funcionou. no caso eu coloquei na tag ao inves de button pra ser numa navbar mas mesmo assim nao ta funcionando não sei se é pq eu to usando jquerry do materialize no arquivo

@fecassadev 2 года назад

consegue compartilhar parte do código no codePen? Você está conseguindo chegar na função?

@silverjrbr 2 года назад

@@fecassadev sim eu ja fiz o codigo inteiro vou tentar colocar lá

@fecassadev 2 года назад

Eu tb deixei o link do exercício no codepen, vc acessou? (está na descrição do vídeo)

@silverjrbr 2 года назад

@@fecassadev vou ver

@silverjrbr 2 года назад

@@fecassadev coloquei no codepen pra voce ver

@CiroPeixoto Год назад

E mais, usar framework não quer dizer que é mais qualquer coisa.... As ferramentas são feitas para serem utilizada e não ao contrário, ou seja as ferramentas não devem impor seu uso... Assim concordo que saber usar o básico da programação html é PRIMORDIAL!!! Aliás as ferramentas são criadas COM JAVASCRIPT, PHP etc...