MediaQueryList.addListener()

Метод addListener() інтерфейсу MediaQueryList додає слухача до MediaQueryListener, який викличе вказану функцію щойно стан медіа-запиту зміниться.

Цей метод є простим скороченням для EventTarget.addEventListener() задля зворотньої сумісності. В старших веб-переглядачах доводиться використовувати addListener замість addEventListener, тоді як в нових MediaQueryList просто успадковує EventTarget.

Синтаксис

MediaQueryList.addListener(func)

Параметри

func
Функція-слухач, яку буде викликано щораз, як зміниться стан медіа-запиту. В первинній реалізації слухачем був об'єкт MediaQueryListListener, а в новій вже використано звичайний механізм подій, тож слухач — це звичайна функція, а об'єкт події MediaQueryListEvent успадковано від Event.

Вертає

Нічого.

Приклади

var mql = window.matchMedia('(max-width: 600px)');

function screenTest(e) {
  if (e.matches) {
    // Вікно є вужчим за 600 пікселів (або ж точно 600)
    para.textContent = 'Маємо вузький екран, щонайбільше 600px';
    document.body.style.backgroundColor = 'red';
  } else {
    // Вікно є ширшим за 600 пікселів
    para.textContent = 'Маємо широкий екран — понад 600px завширшки';
    document.body.style.backgroundColor = 'blue';
  }
}

mql.addListener(screenTest);

Специфікації

Специфікація Статус Примітка
CSS Object Model (CSSOM) View Module
The definition of 'addListener' in that specification.
Working Draft Початкова виознака

Підтримка веб-переглядачами

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
addListenerChrome Full support 9Edge Full support 12Firefox Full support 6IE Full support 10Opera Full support 12.1Safari Full support 5.1WebView Android Full support YesChrome Android Full support 18Firefox Android Full support YesOpera Android Full support YesSafari iOS Full support 5Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown

Див. також

Мітки документа й учасники

Зробили внесок у цю сторінку: asmforce
Востаннє оновлена: asmforce,