相关疑难解决方法(0)

HTML5标签为用户提供了一个按钮,用于在移动设备(iOS)的Safari上切换全屏模式.

我想捕获并处理此用户操作,但是当按下按钮并且播放器进入全屏模式时,它似乎不会引发事件.

以下是HTMLVideoElement类的Safari API链接:

http://developer.apple.com/library/safari/#documentation/AudioVideo/Reference/HTMLVideoElementClassReference/HTMLVideoElement/HTMLVideoElement.html#//apple_ref/doc/uid/TP40009356

我们可以很容易地找出视频暂停播放的时间是用Javascript播放的,如下所示:

function onload()
{
  var player = document.getElementsByTagName("video")[0];
  player.addEventListener('play',videoPlayHandler,false);
  player.addEventListener('pause',videoPauseHandler,false);
}

但是,当视频进入全屏模式时,它们似乎没有任何事件.

我们可以通过调用webkitEnterFullscreen()来强制视频进入全屏模式以响应用户操作,但这对我没有帮助.我需要知道用户何时点击全屏按钮.

隐藏控件并通过我自己的自定义控件替换它们听起来像一个非常冗长的解决方案.

我能想到的另一个选择是设置一个计时事件,不断检查webkitDisplayingFullscreen属性,但在内存管理方面这感觉是件坏事.

有谁能建议更好的解决方案？

我的屏幕上有两个按钮。每个人都会触发一段 javascript 代码来进入和退出全屏模式。

按钮 1：进入全屏模式

按钮 2：退出全屏模式

如果我首先单击按钮 1，它会将我带到全屏模式，然后如果我单击按钮 2，它将退出全屏模式。

但是，如果我使用F11或通过chrome menu进入全屏模式，意外地按钮 2不再工作。

为什么会发生这种情况以及如何解决？

按钮 1 代码：

goFullscreen();
function goFullscreen() {
    var el = document.documentElement,
      rfs = el.requestFullscreen
        || el.webkitRequestFullScreen
        || el.mozRequestFullScreen
        || el.msRequestFullscreen 
    ;

    rfs.call(el);
}

按钮 2 代码：

document.webkitCancelFullScreen();

我也试过这个，但没有运气：

document.webkitExitFullscreen();