Home / Programmazione / Javascript - AJAX / Trovare le dimensioni dello schermo con Javascript
Mattepuffo

Trovare le dimensioni dello schermo con Javascript

Trovare le dimensioni dello schermo con Javascript

Vi propongo due funzioncine per identificare le dimensioni dello schermo e la risoluzione con Javascript:

  • risoluzioneVideo identifica la risoluzione di tutto il monitor, a prescindere dalla dimensione del browser
  • dimensioneFinestra identifica la grandezza del browser; in questo caso ho usato jQuery

Nella pagina ho impostato questo:

    $(function () {
        risoluzioneVideo();
        dimensioneFinestra();
        $(window).resize(function () {
            dimensioneFinestra();
        });
    });

In questo modo possiamo calcolare la nuova dimensione quando ridimensioniamo il browser.

La stessa cosa non vale ovviamente per la risoluzione del video.

Ecco le due funzioni:

function risoluzioneVideo() {
    var risWidth = screen.width;
    var risHeight = screen.height;
    $('#risoluzione_video').html('<span>' + risWidth + '</span> x <span>' + risHeight + '</span> pixel');
}

function dimensioneFinestra() {
    var winWidth = $(window).width();
    var winHeight = $(window).height();
    $('#dimensione_finestra').html('<span>' + winWidth + '</span> x <span>' + winHeight + '</span> pixel');
}

Vi basta mettere due div, o qualsiasi componente vogliate, per visualizzare il tutto nella pagina.

Il risultato lo potete vedere anche nella sezione Strumenti.

Enjoy!