在Firefox的js结尾处退出全屏视频？

Question

<script>    
  $(document).ready(function(){
    $('#Video').bind('ended', function(){

      $('#Video')[0].mozCancelFullScreen();

    });
  });    
</script>

我试图在全屏模式下使用视频按钮创建一个网站,以全屏显示一些视频.在视频结束时,视频屏幕应该关闭并显示全屏网站概述,但它不起作用.只有$('#Video').fadeout(); 作品和网站概述显示在视频结束后,但我无法重新打开视频.我试图用鼠标点击处理程序关闭全屏视频,但它也不起作用.

var Video = document.getElementById("Video")
    buttonFullscreen = document.getElementById("button");   

if (Video && buttonFullscreen) {
   videoFullscreen.addEventListener("click", function (evt) {

    if (Video.mozRequestFullScreen) {
      Video.mozRequestFullScreen();
      Video.mozSrcObject=null;
      Video.play();

      mouse.click( function () {
        Video.mousedown(function(event) {
          Video.pause();
          Video.mozSrcObject=null;
          Video.mozCancelFullScreen();
        }); 
     });

    }
  else if (Video.webkitRequestFullScreen) {
    Video.webkitRequestFullScreen();
    Video.play();

  }, false);
} 

Answer 1

我还没有能够在没有直接用户交互的情况下使document.mozCancelFullScreen工作.因此,从某些事件回调或超时调用它似乎不起作用.

解决方法是删除元素然后放回原来的位置.这就是$ .fadeout()为你工作的原因,因为它从DOM中删除了元素.我用过:

var parentNode = videoElement.parentNode;
parentNode.removeChild(videoElement);
parentNode.appendChild(videoElement);

这看起来很糟糕,但这是我能让它在FF工作的唯一方法.