Wie kann ich den Browser eines Besuchers mithilfe von JavaScript in den Vollbildmodus versetzen, so dass dies mit IE, Firefox und Opera funktioniert?
javascript
fullscreen
user63898
quelle
quelle
sprintf('Dear user, the best experience with this site is in fullscreen mode. To view this site full screen, press %s.', _get_browsers_full_Screen_key())
Antworten:
Dies ist so nah wie möglich am Vollbildmodus in JavaScript:
quelle
In neueren Browsern wie Chrome 15, Firefox 10, Safari 5.1, IE 10 ist dies möglich. Es ist auch für ältere IE über ActiveX abhängig von ihren Browsereinstellungen möglich.
So geht's:
Der Benutzer muss natürlich zuerst die Vollbildanforderung akzeptieren, und es ist nicht möglich, diese beim Seitenladen automatisch auszulösen. Sie muss von einem Benutzer (z. B. einer Schaltfläche) ausgelöst werden.
Lesen Sie mehr: https://developer.mozilla.org/en/DOM/Using_full-screen_mode
quelle
document.documentElement
, wird sichergestellt, dass Sie das richtige Stammelement ('html' oder 'body') erhalten. Und verwenden kann verwendencancelFullscreen()
, um es zu schließen (oder 'F11' erneut für IE senden).Dieser Code enthält auch Informationen zum Aktivieren des Vollbildmodus für Internet Explorer 9 und möglicherweise ältere Versionen sowie für neuere Versionen von Google Chrome. Die akzeptierte Antwort kann auch für andere Browser verwendet werden.
Quellen:
requestFullscreen
"nur während" "[m] ost UIEvents und MouseEvents wie Klicken und Keydown usw." funktioniert, "daher kann es nicht böswillig verwendet werden".)quelle
documentElement
ist besser alsbody
für mich.Hier ist eine Komplettlösung zum Ein- und Aussteigen aus dem Vollbildmodus (auch bekannt als Abbrechen, Beenden, Escape).
quelle
msIsFullScreen
?webkitCancelFullScreen
ist jetztwebkitExitFullscreen
. generatecontent.org/post/70347573294/…document.fullScreenElement && document.fullScreenElement !== null
elem
intoggleFull()
vondocument.body
zudocument.documentElement
, um das Problem mit dem linken und rechten Rand zu behebenSie können die Vollbild-API verwenden. Hier sehen Sie ein Beispiel
quelle
Bevor wir diese neue Technologie beschreiben, muss ich jedoch beachten, dass diese Technologie experimentell ist und von allen wichtigen Browsern unterstützt wird .
Das vollständige Tutorial finden Sie hier: http://www.css-jquery-design.com/2013/11/javascript-jquery-fullscreen-browser-window-html5-technology/
Hier funktioniert Demo: http://demo.web3designs.com/javascript-jquery-fullscreen-browser-window-html5-technology.htm
quelle
Ich habe das benutzt ...
quelle
Einfaches Beispiel von: http://www.longtailvideo.com/blog/26517/using-the-browsers-new-html5-fullscreen-capabilities/
quelle
Funktion erstellen
In HTML Code wie einfügen
quelle
Jetzt, da die Vollbild-APIs weiter verbreitet sind und zu reifen scheinen, können Sie Screenfull.js ausprobieren . Ich habe es gestern zum ersten Mal benutzt und heute läuft unsere App in (fast) allen Browsern wirklich im Vollbildmodus!
Stellen Sie sicher, dass Sie es mit der
:fullscreen
Pseudoklasse in CSS koppeln . Weitere Informationen finden Sie unter https://www.sitepoint.com/use-html5-full-screen-api/ .quelle
Glücklicherweise kann dies für ahnungslose Webbenutzer nicht nur mit Javascript durchgeführt werden. Sie müssten browserspezifische Plugins schreiben, falls diese noch nicht vorhanden sind, und dann die Leute dazu bringen, sie herunterzuladen. Das nächstgelegene Fenster ist ein maximiertes Fenster ohne Werkzeug oder Navigationsleisten, aber die Benutzer können die URL weiterhin sehen.
window.open('http://www.web-page.com', 'title' , 'type=fullWindow, fullscreen, scrollbars=yes');">
Dies wird im Allgemeinen als schlechte Praxis angesehen, da dem Benutzer viele Browserfunktionen entzogen werden.
quelle
Versuchen Sie screenfull.js . Es ist eine nette Cross-Browser-Lösung, die auch für den Opera-Browser funktionieren sollte.
Demo .
quelle
Dies kann unterstützen
quelle
Kannst du es versuchen:
quelle
Versuchen Sie dieses Skript
Verwenden Sie zum Aufrufen aus dem Skript diesen Code:
oder mit Hyperlink verwenden Sie diese
quelle
In Firefox 10 können Sie die aktuelle Seite mit diesem Javascript in den Vollbildmodus (echten Vollbildmodus ohne Fensterchrom) versetzen:
quelle
Dadurch wird Ihr Fenster im Vollbildmodus angezeigt
Hinweis: Damit dies funktioniert, benötigen Sie eine Abfrage von http://code.jquery.com/jquery-2.1.1.min.js
Oder machen Sie einen Javascript-Link wie diesen.
quelle
Wenn Sie sich in einer "Kiosk" -Situation befinden, können Sie dem Browserfenster nach dem Start einen F11 zuführen. Dies ist kein guter Start und der Benutzer kann möglicherweise einen Touchscreen oben einstecken und eine Halbvollbildansicht erhalten, aber das Füttern des F11 kann zur Not oder nur um mit einem Projekt zu beginnen.
quelle
Hier ist meine vollständige Lösung für
Full Screen
undExit Full Screen
beides (vielen Dank an die Hilfe aus der obigen Antwort des Turms):// CALLING:
quelle