我正在使用以下代码在页面上实现HTML5视频
<video autoplay>
<source src="/resources/video/product-hero.mp4.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="/resources/video/product-hero.webmhd.webm" type='video/webm; codecs="vp8, vorbis"' />
</video>
这很好用,嵌入在FF,Safari和Chrome的页面上.我喜欢什么,因为这个视频没有控制,并且意味着嵌入在没有边框的页面中(视频中的白色BG)是要有一个图像代替视频.
如果无法使用元素渲染视频,我想将图像作为后备.我看过以下帖子:html5视频后备建议(没有闪存)开始讨论.但不确定这些答案是否是我所需要的.
我的直觉告诉我,我可以让JQuery检测视频功能,如果不支持视频,那么写出一些显示图像的HTML.但是我想看看是否有更简单的东西.
是否有一种很好的方法来检测客户端浏览器是否允许HTML5视频的内联媒体播放？
更新
我不是想简单地检测视频支持.
我正在尝试检测视频是否只能播放全屏或内联播放.因为在iPhone的Safari游戏中,iOS视频只能全屏播放,但在iPad上可以在线播放视频.并且通过内联我的意思是在页面中没有切换到全屏.
我试图告诉我的视频是否会在视频开始之前在UIWebView中的iPhone上启动视频(如同全屏/在本机视频播放器中一样)进行内联播放.我无法知道UIWebView是否具有allowsInlineMediaPlayback = YES我不知道的应用程序或我的视频显示在哪个页面上的设置.
我的目标是只显示视频是否可以内联播放.
有没有办法从javascript读取allowInlineMediaPlayback设置,或检测我的视频是否内联播放？