We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

window.matchMedia Redirect 1

« window

Summary

Returns a new MediaQueryList object representing the parsed results of the specified media query string.

Syntax

mql = window.matchMedia(mediaQueryString)

where mediaQueryString is a string representing the media query for which to return a new MediaQueryList object.

Example

if (window.matchMedia("(min-width: 400px)").matches) {
  /* the view port is at least 400 pixels wide */
} else {
  /* the view port is less than 400 pixels wide */
}

This code lets you handle things differently when the window is very narrow.

See Using media queries from code for additional examples.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 9 6.0 (6.0) 10 12.1 5.1
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 6.0 (6.0) Not supported 12.1 5

Specification

See also

Document Tags and Contributors

Last updated by: Sheppy,