So beenden Sie eine Vollbild-Webanwendung

Question

Wir versuchen, unsere Webanwendung als Vollbild-Webanwendung auszuführen. Ich habe diese Tags mit dieser Meta zu arbeiten:

<meta name="apple-mobile-web-app-capable" content="yes"> 
    <meta name="apple-mobile-web-app-status-bar-style" content="default"> 
    <meta name="apple-mobile-web-app-title" content="Full Screen"> 

So, jetzt, wenn Sie den Web-App von Ihrem Home-Bildschirm auf dem iPhone oder Android-Geräten starten, wird es startet in Vollbild (ohne Browser Kontrollen).

Jetzt müssen wir einen Weg, damit der Benutzer zu verlassen, ich hatte gehofft, um ein Menü zu erstellen, die eine Taste verlassen hatte, aber mit window.close() gibt mir den folgenden Fehler in Chrom:

Scripts may close only the windows that were opened by it. 

Was wäre der richtige Weg, damit umzugehen?

Answer 1

Eine Möglichkeit, einen Vollbild-Modus zu schließen, ist das folgende Skript zu verwenden:

function exitFullScreen(element) { 
     var requestMethod = element.exitFullscreen || 
                element.mozCancelFullScreen || 
                element.webkitExitFullscreen || 
                element.msExitFullscreen; 
     if (requestMethod) { 
       requestMethod.call(element); 
     } else { 
       console.log("Oops. Request method false."); 
      } 
    } 

Und dann rufen Sie es mögen:

 var $smallscreenButton = $("#smallscreen-button"); 
     $smallscreenButton.on("click", function() { 
        var elem = document; 
        exitFullScreen(elem); 
     }); 

Der Fehler, den Sie mit window.close Phased() ist, dass Sie das Fenster innerhalb desselben Javascript mit window.open() geöffnet haben sollten und dann sollte es richtig geschlossen haben. Sie können einfach keine zufälligen Fenster mit Javascript schließen, deshalb können Sie nicht schließen, ohne zuerst zu öffnen.

Also, etw wie:

var myWindow = window.open(); 
myWindow.close(); // this works. 

Quellen:

[1] How can we programmatically enter and exit the fullscreen mode in javascript?

[2] window.close() doesn't work - Scripts may close only the windows that were opened by it

Answer 2

hier ein nettes Tutorial auf How to user HTML5 fullscreen api

Von diesem , um den Vollbildmodus zu verlassen:

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

Sie können den obigen Code in jedes DOM-Element des Klick-Methode schreiben wie, sagen jquery mit:

$("#exitFullScreen").click(function(){ 
    // the above code 
     if (document.exitFullscreen) { 
     document.exitFullscreen(); 
    } else if (document.webkitExitFullscreen) { 
     document.webkitExitFullscreen(); 
    } else if (document.mozCancelFullScreen) { 
     document.mozCancelFullScreen(); 
    } else if (document.msExitFullscreen) { 
     document.msExitFullscreen(); 
    } 
}); 

Weitere Referenzen:

1. https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode

2. http://davidwalsh.name/fullscreen

3. http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/

4. http://updates.html5rocks.com/2011/10/Let-Your-Content-Do-the-Talking-Fullscreen-API