Table of Contents

Class MediaQueryList

Namespace
CSharpToJavaScript.APIs.JS
Assembly
CSharpToJavaScript.dll

A MediaQueryList object stores information on a media query applied to a document, with support for both immediate and event-driven matching against the state of the document.

[Value("MediaQueryList")]
public class MediaQueryList : EventTarget
Inheritance
MediaQueryList
Inherited Members

Remarks

You can create a MediaQueryList by calling MatchMedia(string) on the Window object. The resulting object handles sending notifications to listeners when the media query state changes (i.e., when the media query test starts or stops evaluating to true).

This is very useful for adaptive design, since this makes it possible to observe a document to detect when its media queries change, instead of polling the values periodically, and allows you to programmatically make changes to a document based on media query status.

-Media queries
-Using media queries from code
-MatchMedia(string)
-MediaQueryListEvent
-The article DevicePixelRatio also has a useful example

See also on MDN

Constructors

MediaQueryList()

public MediaQueryList()

Properties

Matches

The matches read-only property of the
MediaQueryList interface is a boolean value that returns
true if the Document currently matches the media query list,
or false if not.

[Value("matches")]
public bool Matches { get; }

Property Value

bool

A boolean value that is true if the Document
currently matches the media query list; otherwise, it's false.

Remarks

You can be notified when the value of matches changes by watching for the
MediaQueryList.Change event to be fired at the
MediaQueryList.

-Media queries
-Using media queries from code
-MatchMedia(string)
-MediaQueryList
-MediaQueryListEvent

See also on MDN

Media

The media read-only property of the
MediaQueryList interface is a string representing a
serialized media query.

[Value("media")]
public string Media { get; }

Property Value

string

A string representing a serialized media query.

Remarks

Onchange

[Value("onchange")]
public EventHandlerNonNull Onchange { get; set; }

Property Value

EventHandlerNonNull

Methods

AddListener(EventListener?)

IMPORTANT
Deprecated
The deprecated addListener() method of the
MediaQueryList interface adds a listener to the
MediaQueryListener that will run a custom callback function in response to
the media query status changing.
[Value("addListener")]
public GlobalObject.Undefined AddListener(EventListener? callback)

Parameters

callback EventListener

Returns

GlobalObject.Undefined

None (GlobalObject.Undefined).

Remarks

In older browsers MediaQueryList did not yet inherit from EventTarget,
so this method was provided as an alias of AddEventListener(string, Action?, Union26).
Use addEventListener() instead of addListener() if it is
available in the browsers you need to support.

-Media queries
-Using media queries from code
-MatchMedia(string)
-MediaQueryList
-MediaQueryListEvent

See also on MDN

RemoveListener(EventListener?)

IMPORTANT
Deprecated
The removeListener() method of the
MediaQueryList interface removes a listener from the
MediaQueryListener.
[Value("removeListener")]
public GlobalObject.Undefined RemoveListener(EventListener? callback)

Parameters

callback EventListener

Returns

GlobalObject.Undefined

None (GlobalObject.Undefined).

Remarks

In older browsers MediaQueryList did not yet inherit from EventTarget,
so this method was provided as an alias of RemoveEventListener(string, Action?, Union27).
Use removeEventListener() instead of removeListener() if it is
available in the browsers you need to support.

-Media queries
-Using media queries from code
-MatchMedia(string)
-MediaQueryList
-MediaQueryListEvent

See also on MDN