Question

所以我不熟悉开发并掌握HTML和CSS的基本知识，我试图对我的个人网站进行编码，但我在iPhone上的视频出现问题（它可以正常使用其他手机）。

我认为这是因为我使用了自动播放功能，但我不想破坏我网站的桌面体验。是否可以将自动播放保留在桌面上，并且仍然可以在iOS上以某种容量显示视频？

<div class="image1">
<video  autoplay="true" controls="true" autoplay loop class="video">
    <source src="assets/tbgv.mp4" type="video/webm">
    <source src="assets/tbgv.mov" type="video/mov">
    <source src="assets/tbgv.ogv" type="video/ogg">
</video>

Answer 1

iOS和Mac上确实存在一些自动播放功能限制。但是，您可以通过JavaScript承诺来了解视频是否被拒绝，并根据该行为改变其行为。

您可以使用以下内容：

var promise = document.querySelector('video').play();

if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

有关更多详细信息，请查看以下文章： https://webkit.org/blog/6784/new-video-policies-for-ios/

HTML视频无法在iPhone上运行

1 个答案: