Почему не корректно работает видео на сайте?

Question

[Юлия Г]

Здравствуйте.
Помогите решить данную проблему.

Есть сайт https://maxtreat.ru/ с блоке под баннером КОММЕРСАНТЬ есть фото с кнопкой - по клику на кнопку подгружается видео во всплывающем окне.
Проблема состоит в следующем.
Видео открывается. Прописано оно через тег video

Вот код всплывающего окна.

<div class="video-window">
    <div class="video-window__shell">
      <button class="video-window__shell__close"></button>
      <video src="main/video/videoplayback.mp4" controls></video>
    </div>
  </div>

К видео прописан controls - панель управления. При клику на кнопку на панели управления видео начинает работать. Если не остановить видео по клику на эту же кнопку, а просто нажать на крестик (ЗАКРЫТЬ МОДАЛЬНОЕ ОКНО С ВИДЕО) - то видео продолжает работать.
Как сделать чтобы при клике на крестик видео полностью переставало работать. Даже если забыл нажать ОСТАНОВИТЬ ВИДЕО на панели управления.

Если controls убрать - видео вообще не работает. Только картинка и всё.

Заранее спасибо всем откликнувшимся

Answer 1

[MalGym]

Во-первых , я бы сделал это все вставкой через JS ( само видео ) , просто нет смысла его грузить ( тянуть с серва ) , пока пользователь не нажал , чтобы открыть этот попап , это позволит вам выиграть в скорости .
Во-вторых , когда пользователь закрывает попап , можете чистить путь или опять удалять полностью видео . При повторном открытии оно возьмется уже с кеша и все будет отлично ( если все правильно настроили )