video不能在iOS10 Chrome上播放
我似乎无法find这个video片段有什么问题。
<video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/webm" src="sample.webm"></source> <source type="video/mp4" src="sample.mp4"></source> </video>
video在Safari中没有任何问题(没有testingiOS的早期版本,但我唯一担心的是自动播放问题?),但在Chrome上,我看到的唯一一件事是封面图像和播放button,触发任何东西。 我错过了什么吗? 我真的需要使用JS来实现它吗?
更新:使用iOS Chrome播放Webm文件似乎有问题 – 我已经尝试了几个来自不同位置的文件,他们似乎需要先下载才能播放。
谷歌浏览器目前有一个错误 ,它不会自动播放一个
.webm
video, 如果它在别的之后 。 尝试使用发布的代码: http : //thenewcode.com/777/Create-Fullscreen-HTML5-Page-Background-Video
如果以前的build议没有帮助,请尝试在Github上使用脚本播放示例( video.js
和简单):
https://github.com/videojs/video.js
https://github.com/samdutton/simpl/blob/gh-pages/video/scripted/index.html
另外,请阅读移动浏览器中专门用于静音自动播放的问题:
https://github.com/whatwg/html/issues/976
阅读SOpost也是有用的:
有效检测设备是否播放具有自动播放属性的静音video
我似乎无法find这个video片段有什么问题。
<video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/webm" src="sample.webm"></source> <source type="video/mp4" src="sample.mp4"></source> </video>
…更新:似乎有一个问题与iOS浏览器玩WebM文件。
最简单也是最好的解决方法是确保先声明mp4文件,然后在第二位声明webm (与您显示的顺序相反)。 我相信iOS预计mp4会成为HTML5video标签中的第一个文件。 所有的iOS看到是src="sample.webm"
,这是不是一个有效的预期的MPEG编解码器,所以导致你的“…播放button,不会触发任何东西” 。 你有一个沉默的错误。
试试:
<video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/mp4" src="sample.mp4"></source> <source type="video/webm" src="sample.webm"></source> </video>
附注:只是我的意见,但我认为这里的webm是多余的,因为主要支持系统(基于Google的技术)已经可以处理mp4了 。
最好是在[最终用户]的浏览器中提供这些video解码器,可selectmp4或ogv (仅限于Firefox)。
PS:由于SIM数据允许,大多数移动系统的自动播放function被禁用。 最终用户必须select播放该video。 可能有networking上的聪明的解决方法,但请记住,这是预期的行为,所以不是你的当前代码的问题。