У меня есть следующий код на моей веб-странице (инфраструктура Python/Django), чтобы включить воспроизведение видео в фоновом режиме.Автоматически воспроизводить видео на Mac
HTML
<div class="video-container">
<div class="video-container-bg">
<video playsinline autoplay muted loop poster="{{page.image.url}}" id="bgvid">
<source src="{{page.video.url}}" type="video/mp4">
<source src="{{page.mac_video.url}}" type="video/webm">
</video>
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-8">
<div class="animation-element bounce-up">
<h1 class="page-title">{{page.page_title}}</h1>
<p class="strapeline">{{page.strapline}}</p>
<a class="butt" href="#about-us">Learn More</a>
</div>
</div>
</div>
</div>
</div>
</div>
CSS
video#bgvid {
position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
min-height:100%;
overflow: hidden !important;
z-index: -100;
-ms-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url() no-repeat;
background-size: 100%;
}
.video-container {
min-height: calc(100vh - 75px);
overflow: hidden !important;
position: relative;
}
.video-container-bg {
padding-top: 25vh;
color: #fff;
}
Он отлично работает на все, кроме Safari, где ничего не играет. Почему нет? Это что-то, что Apple постаралась предотвратить? Фактически, когда я запускаю Safari в Windows, он говорит мне, что не может воспроизводить видео в формате HTML5. Это правильно?
Под «исключением Mac» вы подразумеваете, что он не работает в Safari? Или любой браузер на Mac? –
Я имею ввиду Safari - я еще не тестировал других – HenryM
Я понятия не имею, что здесь происходит. Теперь я нахожу, что люди могут воспроизводить видео на модемном Mac, но у них нет звука, а для тех же видео на iPad они не будут играть. Это должно быть как-то связано с кодеками, но я не знаю, с чего начать. – HenryM