Verificare la risoluzione dello schermo in Javascript con matchMedia

Ho trovato una funzione per Javascript che ci consente di verificare la risoluzione dello schermo: window.matchMedia!

Dal nome già si può capire cosa fa.

In sostanza controlla se lo schermo combacia con la media query che si vuole controllare.

Spiegata così, potrebbe non essere chiaro; quindi vediamo un esempio:

            if (window.matchMedia("(max-width: 700px)").matches) {
                console.log('OK');
            } else {
                console.log('KO');
            }

Se avete familiarità con le media queries, potete vedere la similitudine con le regole CSS.

Potete fare i controlli esattamente come con i CSS.

Enjoy!