Capturando a resolução do dispositivo com JavaScript

15/01/2018 20:42:52

As vezes no desenvolvimento de um sistema precisamos pegar a resolução da tela para diversos fins, esse é um procedimento muito simples quando usamos o javascript para realizar essa tarefa, para capturarmos a resolução do monitor ou tela de dispositivos como smartphones ou tabletes precisamos usar width e height, onde width vai ser a largura e height a altura por exemplo em um computador que seu monitor tem resolução de 1080 por 720 os 1080 vai ser representados por width e 720 por height, vejamos exemplo:

<script type="text/javascript">    
    //pega a largura da resolução da tela
    var width = screen.width;
    //pega a altura da resolução da tela
    var height = screen.height;
</script>

Vejamos uma função onde a resolução é validada pelo if onde se width do monitor for menor que 800px ou height menor 600px ele exibe uma mensagem caso seja maior ele exibe outra mensagem veja função abaixo

<script type="text/javascript">
    
    //pega a largura da resolução da tela
    var width = screen.width;
    //pega a altura da resolução da tela
    var height = screen.height;
    
    //verifica se a resolução dará uma boa visão do site
    if (width <= 800 || height <= 600)
        alert("A resolução da tela do seu monitor é " + width + "x" + height + ". Para visualizar o site é recomendado uma resolução de no mínimo 1024x768.");
    else
        alert("A resolução da tela do seu monitor é " + width + "x" + height + ".");
    
</script>


Avatar de KéciaPor: Kécia dia: 15/01/2018 20:42:52em: JavaScriptresolução do dispositivo com JavaScript,Detectar a resolução da tela com JavaScript - 2893 Visitas