我正在使用video.js构建自定义视频播放器。我想要在功能中构建的一件事是检查以确保如果视频在全屏模式下结束播放,它会恢复到正常模式。我认为使用video.js api很容易实现。
在我的代码中,我正在侦听“结束”事件,然后在该事件的处理程序中触发 cancelFullScreen() 方法,这在 Chrome 中工作得非常好(它甚至可以在 IE 7/8 的闪存回退模式下工作),但是它在 Firefox 19 中根本不起作用 - 窗口只是保持全屏模式。
任何想法为什么?
这是我的标记:
<link rel="stylesheet" href="http://vjs.zencdn.net/3.2/video-js.css">
<script src="http://vjs.zencdn.net/c/video.js"></script>
<div class="vid_container" style="width: 934px; height: 524px; left: 0; top: 0;">
<video id="video_NewMoon" controls class="video-js vjs-default-skin" width="934" height="524" poster="/cms/arcadiacorp_uk/repository/pages/static/static-0000008447/images/poster.jpg" data-setup="{}">
<source src="http://ecmcstg.arcadiagroup.ltd.uk/cms/arcadiacorp_uk/repository/pages/static/static-0000008447/flash/nailVid.mp4" type="video/mp4">
<source src="http://ecmcstg.arcadiagroup.ltd.uk/cms/arcadiacorp_uk/repository/pages/static/static-0000008447/flash/nails.webm" type="video/webm">
<a href="http://ecmcstg.arcadiagroup.ltd.uk/cms/arcadiacorp_uk/repository/pages/static/static-0000008447/flash/nailVid.mp4" title="Click here to download the video">Your browser cannot play this video, click here to download it instead.</a>
</video>
</div>
这是我的 js 代码,它位于结束 body 标记内:
var myPlayer = _V_("video_NewMoon");
var movEnded = function(){
myPlayer.bigPlayButton.hide();
myPlayer.loadingSpinner.hide();
if(myPlayer.isFullScreen === true) {
console.log("yep, we're fullscreen - lets shut this down");
myPlayer.cancelFullScreen();
}
};
myPlayer.addEvent("ended", movEnded);
我已经尝试了各种其他方法来解决它,例如在结束的处理程序中使用 jquery 触发 Esc 键,但这也不起作用。我现在对这个已经没有耐心了。
哦,当我们讨论错误时,加载微调器在 Chrome 上显示但隐藏在 FF 中。老实说,我宁愿它被隐藏起来。
提前致谢。