Можно ли добавить видео внутри поповера?

Question

Я хотел бы добавить короткое видео в один из моих всплывающих окон. Я пробовал следующее:

    let htmlString = `
    <div class="embed-responsive embed-responsive-16by9">
      <video class="embed-responsive-item" src="..." loop muted></video>
    </div>
    `;

    $('#popover').popover({
      trigger: 'manual',
      html: true,
      content: htmlString
    });

Однако, при активации этого поповера, элемент видео не появляется в DOM. Используя инструменты разработчика, я могу видеть только контейнер с видео <div class="embed-responsive embed-responsive-16by9">.

Answer 1

Разобрался. Установите sanitize: false для всплывающего окна и присвойте контейнеру видео значение width или min-width. Вы также должны слушать всплывающие события , если хотите, чтобы ваше видео запускалось / останавливалось при показе / скрытии.

let html1 = `
    <div style="min-width: 300px;">
      <div class="embed-responsive embed-responsive-16by9">
        <video class="embed-responsive-item" src=".../...mp4" loop muted></video>
      </div>
    </div>
    `;

    $('#popover').popover({
      trigger: 'manual',
      html: true,
      sanitize: false,
      content: html1
    });