Esconder e mostrar div com HTML/CSS e JavaScript
HTML-код
- Опубликовано: 7 фев 2025
- 📒 Ebook gratuito de JavaScript avançado: www.horadecoda...
Neste vídeo você vai aprender a como esconder ou mostrar uma div de duas formas: primeiramente utilizando #CSS e depois com um evento de #JavaScript
★ Nossos Cursos: horadecodar.co...
✔ Nosso Blog: horadecodar.co...
▶ Instagram: @horadecodar
▶ Facebook: / horadecodar 🔷 Telegram: t.me/horadecodar .
🟣 Discord Hora de Codar: / discord - Наука
⭐ Conheça a nossa plataforma de cursos: www.horadecodar.com.br/comunidade-hora-de-codar/
uau, eu estava com dificuldades no meu projeto por que nele eu quero poder ter dois botões de ocultar div, pra deixar o projeto "limpo" e sofisticado, porém, eu estava usando o mesmo código java pra antes e um estava influenciando o outro, agora no seu código eu não só resolvi isso, como também com sua didatica eu consegui melhorar o código, gratidão!!!
📒 Ebook gratuito de JavaScript avançado: www.horadecodar.com.br/ebook-javascript-avancado-gratuito/
Vc é ótimo , continue com seus ótimos vídeos
Tem como animar essa exibição? escorregar de cima pra baixo?
Cara você é fera D++++!!!
valeu! =D
Estou quase chegando no que eu quero que é fazer tipo um quiz com perguntas, respostas e pontuação no final. Tá difícil de encontrar, mas esse vídeo já me deu uma luzinha.
VOCÊ É INCRIVEL CARA ME AJUDOU MUITOO
Perfeito exatamente o que eu buscava
Show de Bola, parabéns pelo trabalho, recebi do nada o seu vídeo e estou agradecido.
valeuu Luciano, tamo junto!
tu salvou muito paizão, muito obrigado!
Tava quebrando a cabeça pra fazer isso no meu projeto, muito obrigado
de nada Vinicius!
Esperando seu curso entrar em promoção na Udemy, eu tentei fazer outros cursos , mas sua didática de colocar os slides antes, indicando as coisas importantes, ajuda muito, divulga mais quando tiver promoção dos cursos
@@viniciusalves-zn9lj oi Vinicius, só se inscrever na minha lista que tu vai receber as promoções assim que saem, basta baixar o ebook na home do blog: www.horadecodar.com.br/
Esse vídeo matou uma dúvida que tinha faz tempo, obrigado ai cara
Muito obrigado, você me salvou cara. Explicação simples e sem firulas.
Show demais! 👏🏾
Tem como fazer isso acontecer só passando o mouse por cima? Como seria?
Valeu cara, ajudou demais!
Ajudou bastante! Obrigado, mano!!!
de nada Rodrigo!
MUITO OBRIGADOOO!!!
Valeu man, ajudou bastante, faltava isso para um entregar um projeto do estágio. kkkk
Ótima dica. Valeu!
de nada! =)
Perfeito!
Obrigado pelo vídeo!
Muito obgd.
Cara, quando eu crio o botão toggle, ele mostra normalmente o conteúdo quando eu clico, mas se eu clicar pra fechar, ele não fecha, fica agarrado no collapse show. O que pode estar acontecendo?
Valeu cara vc é top
obrigado! =)
e se eu tiver duas divs na mesma posição e quero que quando ela apareça a outra suma, o que devo acrescentar?
valeu 👍
Top demais sua aulas! Obrigado.
Muito bom. parabéns pelo trabalho.
Cool video and content ! Great !!!
9:31 - Tem como, ao invés de eu escrever "esconder/mostrar", colocar um símbolo? O código funcionaria?
Colocar esses símbolos, por exemplo:
🔽/🔼
Boa irmão, deu boa aqui!
show!
Parabéns pela a dica!
Bom vídeo Matheus, existe alguma diferença entre usar esse método do vídeo, ou usar o atributo onclick no html para chamar uma função no js?
oi Dabieu, beleza? No fim das contas o resultado final é o mesmo, mas você cria uma acoplação desnecessária de JS em HTML, o que é uma má prática, como CSS no HTML também, o ideal é separar as responsabilidades, para cada arquivo cuidar de uma linguagem específica, facilitando a manutenção do projeto.
se eu fosse trabalhar com 03 div ? seria muito complicado implementar?
Muito bom!!
Existe a possibilidade de animar o efeito de exibir e ocultar?
claro! css ou criar botao bootstrap
Qual a diferença entre onclick e click?
Matheus, como faz isso no *ngIf do angular com typescript?
Tbm queria saber, no type tá dando erro
Professor o eddEventListner não funciona comigo.
O evento click não funciona por isso eu uso onClick no Button.
Oque pode ter de errado?
Seria possível usar essa mesma técnica mas para ser exibido somente quando um determinado vídeo fosse visto até o final?
Gostaria de mostrar/esconder mais de uma div com um botão, como posso fazer isso? Tentei aqui e não funciona de jeito nenhum!
Como é feito o HTML que faz a cobertura de ocultação de um jogo de campo minado .
eu tenho um problema mais complexo. Preciso esconder/aparecer com vários elementos na telas, mas mas nao são divs, são classes. E nenhum exemplo funciona.
Gostei
Valeuuu
👍👍🏆
genio
jenio
PRECISO OCULTAR DE ACORDO COM A URL, NÃO ACHEI EM NUNHUM LUGAR...
O meu ouve um problema porem não consigo resolver, pode me ajudar?
Muito bom o vídeo, mas aqui não funcionou, não reconhece o style.display
E como eu esconderia vários elementos de uma vez?
coloca tudo que vc quer ocultar numa div e oculta essa div
Amigo, fiz três botões usando o pagination do bootstrap e três div, com o id de cada uma. A primeira div usa a classe active, e no javascript tenho que ativar quando clicar no botão correspondente a div. Pode me ajudar. Fiz abaixo mas deu erro:
function paginar(){
var id1 = document.getElementById('id1 ').style.display;
var id2 = document.getElementById('id2 ').style.display;
var id3 = document.getElementById('id3 ').style.display;
if(pag1 == "none") { // Bolo de Abacaxi
document.getElementById('id1 ').style.display = 'block';
document.getElementById('id2 ').style.display = 'none';
document.getElementById('id3 ').style.display = 'none';
} else
if(pag2 == "none") { // Bolo de Cenoura
document.getElementById('id2 ').style.display = 'block';
document.getElementById('id1 ').style.display = 'none';
document.getElementById('id3 ').style.display = 'none';
} else
if(pag3 == "none") { // Bolo de Chocolate
document.getElementById('id3 ').style.display = 'block';
document.getElementById('id1 ').style.display = 'none';
document.getElementById('id2 ').style.display = 'none';
}
}
No style.css
.item{
display: none;
}
.item, .active{
display: block;
}
1
2
3