MediaQueryList.addListener()
El método addListener()
de la interfaz MediaQueryList
añade un escucha al MediaQueryListener
que ejecutará una función de devolución de llamada personalizada en respuesta al cambio de estado de consulta de medios.
Esto es básicamente un alias para EventTarget.addEventListener()
, para propósitos de compatibilidad con versiones anteriores: en los navegadores antiguos se puede usar addEventListener.
Sintaxis
MediaQueryList.addListener(func)
Parametros
- func
-
A function or function reference representing the callback function you want to run when the media query status changes. In the original implementation, the callback was a non-standard
MediaQueryListListener
object. In the new implementation the standard event mechanism is used, the callback is a standard function, and the event object is aMediaQueryListEvent
, which inherits fromEvent
.
Return value
Void.
Examples
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.";
document.body.style.backgroundColor = "red";
} else {
/* the viewport is more than than 600 pixels wide */
para.textContent = "This is a wide screen — more than 600px wide.";
document.body.style.backgroundColor = "blue";
}
}
mql.addListener(screenTest);
Especificaciones
Specification |
---|
CSSOM View Module # dom-mediaquerylist-addlistener |
Compatibilidad con navegadores
BCD tables only load in the browser