No video for this tab.

pytanie zadane 5 sierpnia 2019 w HTML i CSS przez niezalogowany

Witam. Chciałem sobie zrobić video w tle jak w tym tutorialu: https://www.w3schools.com/howto/howto_css_fullscreen_video.asp
ale po wgraniu na serwer film niby się pobiera, ale tło pozostaje białe. W konsoli dostaje błąd:

No video for this tab. handlers.js:350

Co robię źle, że film mi się nie chce włączyć?

1	komentarz 6 sierpnia 2019 przez Job102 Bywalec (2,050 p.) Cześć. Pokaż kod.

komentarz 6 sierpnia 2019 przez niezalogowany

Kod jest taki sam jak w pierwszym przykładzie na strone. jedyne co zmienilem, to film.

1 odpowiedź

odpowiedź 9 sierpnia 2019 przez Job102 Bywalec (2,050 p.)

Witam,

skopiowałem kod do index.html i powiem tak "u mnie działa" :).

poniżej kod, jedyne co zmieniłem to plik filmu.

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Arial;
  font-size: 17px;
}

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

.content {
  position: fixed;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}

#myBtn {
  width: 200px;
  font-size: 18px;
  padding: 10px;
  border: none;
  background: #000;
  color: #fff;
  cursor: pointer;
}

#myBtn:hover {
  background: #ddd;
  color: black;
}
</style>
</head>
<body>

<video autoplay muted loop id="myVideo">
  <source src="TimeScapes Rapture 4K.mp4" type="video/mp4">
  Your browser does not support HTML5 video.
</video>

<div class="content">
  <h1>Heading</h1>
  <p>Lorem ipsum dolor sit amet, an his etiam torquatos. Tollit soleat phaedrum te duo, eum cu recteque expetendis neglegentur. Cu mentitum maiestatis persequeris pro, pri ponderum tractatos ei. Id qui nemore latine molestiae, ad mutat oblique delicatissimi pro.</p>
  <button id="myBtn" onclick="myFunction()">Pause</button>
</div>

<script>
var video = document.getElementById("myVideo");
var btn = document.getElementById("myBtn");

function myFunction() {
  if (video.paused) {
    video.play();
    btn.innerHTML = "Pause";
  } else {
    video.pause();
    btn.innerHTML = "Play";
  }
}
</script>

</body>
</html>

Pozdrawiam.