MediaQueryListEvent
MediaQueryListEvent 对象存储着发生在 MediaQueryList 对象上的变化的信息——作为一个在函数中被 change 事件引用的事件对象。
构造函数
MediaQueryListEvent()-
创建一个新的
MediaQueryListEvent实例。
属性
MediaQueryListEvent 接口的属性继承自它的父接口，Event。
MediaQueryListEvent.matches只读-
一个布尔值，如果
document目前匹配媒体查询列表，该值为true，反之为false。 MediaQueryListEvent.media只读-
一个字符串，代表着一个序列化后的媒体查询。
方法
MediaQueryListEvent 接口的方法继承自它的父接口，Event。
示例
js
var mql = window.matchMedia("(max-width: 600px)");
function screenTest(e) {
if (e.matches) {
/* 视口等于或小于 600 像素 */
para.textContent = "This is a narrow screen — less than 600px wide.";
document.body.style.backgroundColor = "red";
} else {
/* 视口大于 600 像素 */
para.textContent = "This is a wide screen — more than 600px wide.";
document.body.style.backgroundColor = "blue";
}
}
mql.addListener(screenTest);
规范
| 规范 |
|---|
| CSSOM View Module # the-mediaquerylist-interface |