Détection des media queries en JS

(reprise du message précédent)

Nonseulement je plussoie Audrasjb, mais aussi la technique évoquée par Gyzm0. Je l'ai déjà utilisée et elle apporte un autre avantage très important: la maintenabilité.
En effet, la media-query n'est ainsi définie que dans la CSS. Si on doit la changer, on n'a pas besoin d'aller traquer tous les tests barbares faits en js en plus. Les multiples déclarations de constantes parallèles, ça finit toujours par causer des bugs.

Après je n'utilise pas de solution générique et j'adapte aux besoins, aux media-queries que je souhaite exposer etc.

@audrasjb> Si tu avais tout lu tu aurais remarqué que je l'ai déjà mentionné.

Zelalsan a écrit :
Il faut garder en tête que les "em" sont des unités relatives à la taille de police donc tout ça reste relatif. Si tu définies une police de l'élément égale à "20px" alors 1em sera égal à 20px. Ce qui est dit plus haut est en rapport avec la taille standard des navigateurs.

La question n'est effectivement pas px VS em mais mon avis a été donné "en cours de route". Chacun se fait son idée sur l'article proposé et moi j'ai eu la mienne et il s'agit de l'un des deux.
Je ne cherche absolument pas à démontré quoi que ce soit ni à convaincre quiconque. Tu peux en effet travailler avec l'unité qui te convient, ça restera ta méthode de travail et ta façon de faire.

@kustolovic> je n'ai pas prôné l'utilisation JS, le sujet portait là-dessus.

Sinon pour la solution qui consiste à effectuer des tests de largeurs, une solution simple (en jQuery sinon ça devient autrement moins simple pour la retrocompatibilité)
Il suffit de récupérer la taille de base sur l'élément HTML (mais il faut définir sa taille globale sur body bien entendu)

var baseEmInPixel = parseInt($('html').css('font-size'), 10);

Pour la solution proposée par @Gyzm0, voici un article intéressant:

http://davidwalsh.name/device-state-detection-css-media-queries-javascript

Le seul inconvénient de cette technique est que l'on ne détecte que la média-query définie en dernier si plusieurs correspondent.