MediaQueryList

A MediaQueryList object maintains a list of media queries on a 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 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 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 MediaQueryListListener to stop calling on changes to the media query's evaluated result.

Specifications

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

Browser compatibility

See also

• Media queries
• Using media queries from code
• window.matchMedia()
• MediaQueryListListener