Question

我有以下视频，它是滑块的一部分。

<div class="slide video-bg">
    <video muted webkit-playsinline playsinline poster="/video/3/4_Marching_band-HD_1080p.jpg">
        <source src="/video/3/4_Marching_band-HD_1080p.webm" type="video/webm">
        <source src="/video/3/4_Marching_band-HD_1080p.mp4" type="video/mp4">
        <source src="/video/3/4_Marching_band-HD_1080p.ogv" type="video/ogg">
    </video>
</div>

加载页面时，视频会调用play()。在我尝试过的每台桌面浏览器上，这都很棒。但在iOS上，视频从未播放过。

我已阅读https://webkit.org/blog/6784/new-video-policies-for-ios/并试图遵循每项要求。我甚至为视频添加了{{1}}属性，即使我想用js控制它。视频没有音频，在页面加载时可见。知道为什么它不会在iOS上播放吗？

有问题的网页：http://heartland.thinkersites.com/products/

Answer 1

将此添加到您的CSS以从iOS设备中删除难看的播放按钮：

                *::-webkit-media-controls-panel {
                  display: none!important;
                  -webkit-appearance: none;
                }

                *::--webkit-media-controls-play-button {
                  display: none!important;
                  -webkit-appearance: none;
                }

                *::-webkit-media-controls-start-playback-button {
                  display: none!important;
                  -webkit-appearance: none;
                }

ios上的html5视频背景视频

1 个答案: