在iPhone和iPod上,如果YouTube视频嵌入在网页中,则用户可以触摸视频,视频将开始播放 - iOS媒体播放器将滑入,视频将以横向方式全屏播放.视频播放完毕后,iOS媒体播放器会滑出,显示嵌入视频的网页.
使用HTML5 <video>标签,用户可以触摸视频,视频将"缩放"到全屏,并开始播放当前设备方向.视频播放完毕后,用户必须点击一次以显示播放器控件,然后点击"完成"以返回到网页.
不幸的是,将我的视频上传到YouTube不是此应用程序的选项,我还没有找到一个HTML5视频播放器,在视频播放结束后返回网站.我希望视频播放器表现出与YouTube嵌入式视频相同的行为,或视频播放内联视频.强制内联视频是可以在自定义的UIWebView,但不幸的是,这不是一个选项(因为这是一个Web应用程序,而不是本机应用程序).此外,该<video>属性webkit-playsinline不起作用.
是否有任何HTML5视频播放器可以复制嵌入的YouTube视频行为？我错过了任何明显的Javascript解决方法吗？有没有一种方法可以告诉窗口视频在没有用户交互的情况下播放完毕？
编辑:
感谢Jan,这个问题就解决了.随后是工作代码,以及错误/注释列表.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>scratchpad</title>
</head>
<body>
<video id="video">
<source src="movie.mp4" type="video/mp4" />
</video>
<script type="text/javascript">
document.getElementById('video').addEventListener('ended',function(){document.getElementById('video').webkitExitFullScreen();},false);
</script>
</body>
</html>
我犯的错误:
1.忘记在<video>标签中添加ID .
2.测试webkitSupportsFullscreen-I无法将该属性测试为"真实".该论坛帖子中的代码评论说,
// note: .webkitSupportsFullscreen is false while the video is loading
但我无法创建一个返回true的条件.
3.完全错过了这个stackoverflow帖子.
我有一个带有几个html5标签的网页,为用户提供了许多可以选择播放的视频的海报/缩略图.当用户触摸其中一个时,iPhone视频播放器将打开并播放视频.我希望能够在视频播放完毕后自动关闭视频播放器并将用户返回到缩略图.
我为"已结束"事件设置了事件监听器,我可以检测到视频已经完成,但我无法弄清楚如何关闭视频播放器并返回缩略图.它只是等待用户触摸"完成"按钮.在Javascript中有没有办法做到这一点？