全屏问题

时间:2015-05-22 11:28:53

标签: javascript html web fullscreen

我制作了一个Web应用程序,我使用全屏插件,以便用户可以通过按钮启用和禁用全屏模式。

唯一的问题是,当用户启用全屏模式然后转到Web应用程序中的其他页面时,全屏模式会自动禁用。有人能帮助我吗?

此按钮可激活全屏模式:

<a onclick="toggleScreen(document.documentElement);" href="#"><img class="screen" src="assets/admin/pages/img/fullscreen.png" /></a>

全屏脚本:

// If fullscreen is active then close event
var toggle = 0;
      function toggleScreen(element)
{

  if(toggle == 0)
{

launchFullscreen(element);
toggle = 1;

} else {
 exitFullscreen();
toggle = 0;
}
}

// Find the right method, call on correct element
function launchFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  } else if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }

}

function exitFullscreen() {
  if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
}

function dumpFullscreen() {
  console.log("document.fullscreenElement is: ", document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement);
  console.log("document.fullscreenEnabled is: ", document.fullscreenEnabled || document.mozFullScreenEnabled || document.webkitFullscreenEnabled || document.msFullscreenEnabled);
}

// Events
document.addEventListener("fullscreenchange", function(e) {
  console.log("fullscreenchange event! ", e);
});
document.addEventListener("mozfullscreenchange", function(e) {
  console.log("mozfullscreenchange event! ", e);
});
document.addEventListener("webkitfullscreenchange", function(e) {
  console.log("webkitfullscreenchange event! ", e);
});
document.addEventListener("msfullscreenchange", function(e) {
  console.log("msfullscreenchange event! ", e);
});

1 个答案:

答案 0 :(得分:0)

你将不得不调用你导航到的每个网页的toggleScreen函数onload.It肯定会工作。欢呼:)