Проблемы с заменой HTML-изображения фона на видеообъект - PullRequest
0 голосов
/ 18 октября 2019

Я пытаюсь заменить фоновую обложку в богатом html-файле (страница с сайта потокового видео с фоном обложки фильма) эквивалентностью видео. Были некоторые проблемы с подгонкой экрана, которые я решил с небольшими изменениями, но теперь проблема в том, что он становится слишком ярким (по-видимому, один из этих классов (tv-page-entity) добавляет темный слой поверх фонового изображения, который теперь не виденНо я не смог сделать это в полноэкранном видео).

Как это исправить?

Это оригинальный фрагмент:

<tv-background-image class="style-scope tv-page-entity x-scope tv-background-image-0 loaded" style="background-image: url(&quot;./files/image.jpg&quot;)"></tv-background-image>

Вот мои изменения:

<style>
#myVideo {
  position: relative;
  min-width: 100%;
  min-height: auto;
  z-index: -10;
}

.fullscreen-bg::before {
    position: relative;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    z-index: 1;

    /* Any overlay color that you want, here I use black with 25% opacity */
    background-color: rgba(0,0,0,0.8);
}
</style>
    <tv-background-image id="myVideo" class="style-scope tv-page-entity x-scope tv-background-image-1 loaded">
    <video  id="myVideo"  autoplay muted loop>
      <source  src="video/video.mp4" type="video/mp4">
    </video>
    </tv-background-image>

ЗДЕСЬ - это оригинальный html-файл, и мои измененияфайл.

...