在HTML5中播放无限循环的视频
在HTML5中播放无限循环的视频
提问于 2012-04-30 09:15:31
我希望把一个视频放在一个HTML5页面，将开始播放页面加载，一旦完成，循环回到开始没有中断。视频也应该有任何相关的控制，或者是兼容所有的‘现代’浏览器，或有一个polyfill的选项。
以前，我会通过Flash和FLVPlayback来完成这项工作，但我更倾向于在HTML5领域中避开Flash。我想我可以使用javascript的setTimeout来创建一个平滑的循环，但是我应该使用什么来嵌入视频本身呢？有没有什么东西可以像FLVPlayback那样流传输视频？
回答 4
Stack Overflow用户
回答已采纳
发布于 2012-05-02 21:55:37
循环属性应该可以做到这一点：
<video width="320" height="240" autoplay loop>
<source src="movie.mp4" type="video/mp4" />
<source src="movie.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>如果循环属性有问题(就像我们在过去遇到的那样)，请侦听videoEnd事件，并在触发时调用play()方法。
Note1:我对苹果iPad/iPhone的行为不太确定，因为他们对autoplay有一些限制。
Note2:不推荐使用loop="true"和autoplay="autoplay"
Stack Overflow用户
发布于 2018-11-12 16:57:49
截至2018年4月，Chrome (以及其他几个主要浏览器)现在也require了muted属性。
因此，您应该使用
<video width="320" height="240" autoplay loop muted>
<source src="movie.mp4" type="video/mp4" />
</video>Stack Overflow用户
发布于 2019-03-21 21:20:17
对于iPhone，如果你还添加了playsinline，那么它就可以工作：
<video width="320" height="240" autoplay loop muted playsinline>
<source src="movie.mp4" type="video/mp4" />
</video>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/10377453
复制相关文章
相似问题