视频在 iOS 上全屏显示

Question

我正在使用 video.js 库来替代传统视频标签。这主要是因为UI。我遇到的问题是，当我点击视频时，它会全屏显示。这在 iPhone、Chrome 和 Safari

中

正如您在 videojs.com 网站上看到的那样，有一个来自 IGN 的示例，如果您点击视频，它不会全屏显示（其他两个示例会全屏显示）。我已经尝试了他们的一些设置，但仍然无法正常工作

<video-js id='my-video' class='video-js' controls autoplay muted preload='auto' width='300'>
  <source src='video.mp4' type='video/mp4'>
</video-js>

var fistTime = false;

var el_video = videojs('my-video', {
    autoplay: true,
    muted: true,
    controlBar: {
        fullscreenToggle: false
    },
    fullscreen: {
        navigationUI: "hide"
    },
    showRecircScreen: true,
    userInitiated: true
});

// test - for autoplay
el_video.ready(function() {
    el_video.play();
});

el_video.on('fullscreenchange', function() {
    alert("just a test");
});

el_video.on('playing', function() {
    if (!fistTime) {
        fistTime = true;

        el_video.exitFullscreen();
        el_video.play();
    }
});

我已经尝试在 Google 中找到解决方案，在这里，已经阅读了一些相关文档等

Answer 1

您需要 playsinline 属性。

视频在 iOS 上全屏显示

Video goes fullscreen on iOS

video.js