Neste artigo você vai aprender a como pegar as dimensões da janela do navegador, ou seja, as dimensões do monitor do usuário
Fala programador(a), beleza? Bora aprender mais sobre dimensões da tela e navegador com JavaScript
Basicamente vamos acessar o document, um objeto que contém diversos métodos e também propriedades do documento, ou seja, HTML
Nele teremos acesso a documentElement, que possui duas propriedades
- clientWidth: para a largura;
- clientHeight: para a altura;
E então teremos os valores que precisamos
Veja um exemplo prático:
const height = document.documentElement.clientHeight; const width = document.documentElement.clientWidth; console.log(height); console.log(width);
Veja que inserimos os valores para variáveis e posteriormente os imprimimos
Este valor vai variar dependendo do tamanho da janela do browser, ou seja, se houver alguma redução ele diminui ou aumenta
Conclusão
Neste artigo você aprendeu a como pegar as dimensões da janela do navegador com JS
Utilizamos propriedades de document e documentElement, que nos dão a altura e largura do navegador
Lembrando que este resultado varia conforme o tamanho da janela do browser
Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!
Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!
Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias
O link acima contém um cupom de desconto para os cursos!