The media read-only property of the MediaQueryListEvent interface is a DOMString representing a serialized media query.


var media =;


A DOMString representing a serialized media query.


var mql = window.matchMedia('(max-width: 600px)');

function screenTest(e) {
  if (e.matches) {
    /* the viewport is 600 pixels wide or less */
    para.textContent = 'This is a narrow screen — less than 600px wide.'; = 'red';
  } else {
    /* the viewport is more than than 600 pixels wide */
    para.textContent = 'This is a wide screen — more than 600px wide.'; = 'blue';




Specification Status Comment
CSS Object Model (CSSOM) View Module
The definition of 'media' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support Yes ?55 No Yes ?
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support No Yes ?55 Yes ? ?

See also

Document Tags and Contributors

 Contributors to this page: fscholz, chrisdavidmills
 Last updated by: fscholz,