Инициировать изменение размера на видео MediaElement.js в Wordpress

Question

У меня есть тип сообщения, который отображается в модальных окнах.Модалы создаются с использованием библиотеки Remodal .

К сожалению, когда модал открывается, проигрыватели MediaElement.js внутри уже инициализированы с неверными размерами - высота и ширина устанавливаются встроеннымистили с размерами около 1600 пикселей в ширину и 900 пикселей в высоту.Ширина подстраивается под ширину модального, а высота - нет, что создает гигантские черные полосы над и под видео.

Я ищу способ захватить проигрыватель MediaElement.js и изменить его размер.видео, когда модал открывается.Поскольку он инициализирован Wordpress, я не уверен, как его получить.Из других вопросов по стеку кажется, что игроки находятся внутри объекта mejs, и есть встроенный метод для изменения размера игрока и элементов управления.Тем не менее, я пробовал разные вещи, чтобы попытаться вызвать методы изменения размера на плеере, но пока ничего не получалось.Например:

if ( mejs.players.length ) {
  mejs.players.each(function() {
    $(this).setPlayerSize();
    $(this).setControlsSize();
  }
}

Answer 1

Мое текущее решение состоит в том, чтобы вызвать событие изменения размера окна, которое вызывает изменение размера видео.(Примечание: событие триггера jQuery не работает.)

$(document).on('opening', '.remodal', function () {

  // Trigger window resize event to fix mejs video size issues.
  // Don't use jquery trigger event since that only triggers
  // methods hooked to events, and not the events themselves.
  if ( typeof( Event ) === 'function' ) {
    window.dispatchEvent( new Event( 'resize' ) );
  } else {
    var event = window.document.createEvent( 'UIEvents' );
    event.initUIEvent( 'resize', true, false, window, 0 );
    window.dispatchEvent( event );
  }

});