在显示之前加载/播放视频

时间:2018-07-26 15:33:11

标签: html html5 video

我正在使用video标签来显示分辨率为768px及以上的视频。

使用移动优先方法,我将视频容器和video标签设置为display: none

然后在媒体查询中,将视频容器和video标签设置为display: block

<video width="100%" loop="true" autoplay="autoplay" loop muted>
    <source src="/-/video/welcome.mp4" type="video/mp4">
    <source src="/-/video/welcome.webm" type="video/webm">
    <source src="/-/video/welcome.ogv" type="video/ogv">
</video>

使用开发工具时,即使将容器和video标签设置为display: none,我仍然看到视频文件正在以小于768px的显示尺寸加载和播放。

有人知道在媒体查询显示视频之前是否有停止视频播放或加载的方法吗?

0 个答案:

没有答案