Exibir largura da tela com JavaScript

É bem simples, portanto não tem muito o que dizer sobre, então podemos ir quase direto ao ponto assim como eu gosto.

 

Em primeiro lugar, precisa do envento DOMContentLoaded.

Depois adicionamos o window.innerWidth ao elemento para exibir a largura da janela logo que abrir a página.

document.addEventListener('DOMContentLoaded', function() {
        let screenWidth = document.querySelector("#screen_width");
        screenWidth.innerHTML = window.innerWidth;
        window.addEventListener('resize', function() {
            var width = window.innerWidth;
            screenWidth.innerHTML = window.innerWidth;
        });
}, false);

Depois novamente adicionamos o window.innerWidth ao elemento com evento resize para exibir a largura da janela quando redimensionada, substituindo a largura inicial.
"Mais caso só queira exibir a largura quando redimensionar a janela, é só excluir a 3ª linha do código"

E, claro não podemos esquecer de adicionar o elemento HTML com o id que no caso do exemplo é #screen_width.

<div id="screen_width"></div>
Categorias: JavaScript

Deixe seu comentário

Conecte-se a uma conta do google para comentar.

Nenhum comentário

    Seja o primeiro a comentar