javascript - WEB Mobile：无控件自动播放视频

我创建了一个简短的动画，我想在我的网站中实现它。

动画只有几秒钟长，而且没有声音。

我想实现它，就像实现 GIF 一样，意思是：我希望它自动播放，在一个恒定循环中运行，我不希望有任何控件。

所以我渲染了一个 GIF，为了比较，我还渲染了一个 .mp4 视频，而 .mp4 的效果要好得多：

mp4：看起来和我想要的完全一样。

GIF：即使将帧速率分成两半，GIF 文件仍然比 .mp4 大 5 倍左右，而且看起来明显更糟。

所以，当然，我正在实现 .mp4，我就是这样做的：<video autoplay muted loop>– 这在桌面上运行良好，但在移动设备上运行不佳。

在桌面上它基本上表现得像 GIF，但在移动设备上它不会自动播放，当我点击播放时，它会在一种“灯箱”或播放器中打开视频，其他所有内容都消失了，我只看到视频。

我希望移动设备上的视频也自动播放，并且我不希望浏览器打开任何类型的播放器，我该怎么做？或者：这可能吗？

如果可能的话，我真的不想使用 GIF。.mp4 更好。

如果 CSS 无法做到这一点，也许有 JS 方式？

标签： javascripthtmlcssvideo

我已经在移动设备上试过了，它自动播放对我来说很好。也许该playsinline属性可以帮助您。playsinline如果您不希望视频在播放时以全屏方式开始，您应该为移动设备使用该属性。