Ik heb een website waar ik gebruik maak van een fullscreen optie. Je kan klikken op een icoon en vervolgens gaat de pagina in fullscreen mode. Nu is mijn probleem dat wanneer je naar een andere pagina gaat (op de zelfde website) d.m.v. de menu knoppen, je automatisch uit de fullscreen mode gaat. Zou iemand mij kunnen laten zien hoe ik de javascript actie op alle pagina's kan laten doorgaan?

De knop:

Code:

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

De javascript

Code:

// 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 elementfunction launchFullscreen(element){if(element.requestFullscreen){    element.requestFullscreen();}elseif(element.mozRequestFullScreen){    element.mozRequestFullScreen();}elseif(element.webkitRequestFullscreen){    element.webkitRequestFullscreen();}elseif(element.msRequestFullscreen){    element.msRequestFullscreen();}elseif(document.exitFullscreen){    document.exitFullscreen();}elseif(document.mozCancelFullScreen){    document.mozCancelFullScreen();}elseif(document.webkitExitFullscreen){    document.webkitExitFullscreen();}}function exitFullscreen(){if(document.exitFullscreen){    document.exitFullscreen();}elseif(document.mozCancelFullScreen){    document.mozCancelFullScreen();}elseif(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);}// Eventsdocument.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);});

Dit kan niet.

Het is een beveiliging in browsers dat websites niet zonder gebruikersinteractie full-screen geopend kunnen worden (denk anders aan wat popups zouden kunnen doen).

De gebruiker moet dus op een knopje klikken om full-screen te gaan. Verlaat de gebruiker de pagina dan wordt het full-screen gebeuren afgesloten (security van browser). Bij de nieuwe pagina moet de gebruiker weer op een knop klikken om full-screen te gaan, dit kan dus niet "on-load".

De oplossing:
Laadt nieuwe content via AJAX. De pagina wordt dan niet afgesloten en de full-screen website zal blijven staan.