infamousbreed Ответов: 2

Мое видео в качестве кода фонового изображения нуждается в исправлении...пожалуйста, помогите

Я пытаюсь это сделать:
Как создать полноэкранный фон видео[^] урок

У меня есть видео, чтобы показать, но эта часть:-

#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
}</


не работает, поэтому видео имеет позицию и превышает 100% экрана.
Куда мне девать этот код или он просто неправильно разобран?
Или вы можете просто порекомендовать простой способ?

Спасибо тебе, ппл!

Что я уже пробовал:

ищете другой синтаксис и синтаксический анализ 
<script><head><source> var <video><div>
и т.д.

2 Ответов

Рейтинг:
2

phil.o

Это спецификация css, поэтому она обычно входит в свой собственный css-файл, связанный в html-документе с <link rel="stylesheet"...> тег, или непосредственно включенный в html-документ с помощью <style> метка.
Учебник по CSS[^]

infamousbreed 


<link rel="stylesheet" href="style.css" type="text/css" media="video/mp4" />



</head>
<!-- The video -->
<video autoplay muted loop id="myVideo">
  <source src="videobg.mp4" type="video/mp4">
  
  
</video>

    #myVideo {
  position: fixed;
  right: -50;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
}
<script>


var video = document.getElementById("myVideo");


</script>
в теге media="video/mp4" я пробовал "video/mp4" и "myVideo" оба безрезультатно

phil.o

Ваша спецификация css не включена должным образом; Пожалуйста, прочтите HTML CSS чтобы знать, как сделать это правильно. Я бы также посоветовал определить css до используя его, а не после того, как вы это сделали. Наконец, вы должны удалить атрибут media из тега link; он не принадлежит здесь.
Вы должны изучить и ознакомиться с этими основными html-конструкциями; на данный момент Вы, кажется, пишете свой код случайным образом, надеясь, что он будет работать. Но это не очень хороший способ обучения.

Рейтинг:
1

Kris Lantz

Некоторые исследования отсюда: Адаптивный Веб-Дизайн Видео[^]
предполагает, что максимальная ширина и высота должны быть установлены таким образом, чтобы видеоплеер мог масштабироваться вниз чтобы поместить видео в окно.
Я подозреваю, что минимальные значения привязаны к самому видео, а не к доступному оконному пространству. Таким образом, вы получаете 100% от размера видео в любом разрешении.

infamousbreed

Я попробовал это сделать, но весь код не имеет никакого эффекта, поэтому сокращение вдвое до 50% все равно показывает видео одинаково. я предположил, что если весь код не воспринимается браузером, то он должен быть в неправильном месте или набран неправильно, или отсутствует одна из этих вещей ---> "{"