JavaScript

Como pegar as dimensões da janela do navegador?

4 de julho de 2021

Como pegar as dimensões da janela do navegador?

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

pegar as dimensões da janela do navegador capa

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!
Subscribe
Notify of
guest
0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x