{{APIRef}}{{SeeCompatTable}}
A MediaQueryList
object maintains a list of media queries on a {{ domxref("document") }}, and handles sending notifications to listeners when the media queries on the document change.
This makes it possible to observe a document to detect when its media queries change, instead of polling the values periodically, if you need to programmatically detect changes to the values of media queries on a document.
Method overview
void addListener(MediaQueryListListener listener); |
void removeListener(MediaQueryListListener listener); |
Properties
Property | Type | Description |
matches |
boolean |
true if the {{ domxref("document") }} currently matches the media query list; otherwise false . Read only. |
media |
DOMString |
The serialized media query list. |
Methods
addListener()
Adds a new listener to the media query list. If the specified listener is already in the list, this method has no effect.
void addListener( MediaQueryListListener listener );
Parameter (for addListener method)
-
listener
- The {{ domxref("MediaQueryListListener") }} to invoke when the media query's evaluated result changes.
removeListener()
Removes a listener from the media query list. Does nothing if the specified listener isn't already in the list.
void removeListener( MediaQueryListListener listener );
Parameter (for removeListener method)
-
listener
- The {{ domxref("MediaQueryListListener") }} to stop calling on changes to the media query's evaluated result.
Browser compatibility
{{ CompatibilityTable() }}
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 9 | {{ CompatGeckoDesktop("6.0") }} | 10 | 12.1 | 5 |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
Specification
See also
- Media queries
- Using media queries from code
- {{ domxref("window.matchMedia()") }}
- {{ domxref("MediaQueryListListener") }}