ebody: Fullscreen, wenn Orientation = Landscape

Hallo,

ich möchte ein <div> als Vollbild anzeigen, sobald ein Smartphone "quer" gehalten wird, also Orientation = Landscape ist.

Das habe ich mit folgendem Script probiert (da fehlt noch eine If Abfrage).

			function vollbild() {

			  var element = document.getElementById("meinDiv");

			  if (element.requestFullScreen) {

				if (!document.fullScreen) {
				  element.requestFullscreen();
				} else {
				  document.exitFullScreen();
				}

			  } else if (element.mozRequestFullScreen) {

				if (!document.mozFullScreen) {
				  element.mozRequestFullScreen();
				} else {
				  document.mozCancelFullScreen();
				}

			  } else if (element.webkitRequestFullScreen) {

				if (!document.webkitIsFullScreen) {
				  element.webkitRequestFullScreen();
				} else {
				  document.webkitCancelFullScreen();
				}

			  }

			}

window.addEventListener('orientationchange', vollbild);

Die Console gibt dann aber immer folgenden Hinweis:

Failed to execute 'requestFullscreen' on 'Element': API can only be initiated by a user gesture.

Das scheint was ich so recherchiert habe aus Sicherheitsgründen nicht möglich zu sein.

Dann habe ich es mit CSS probiert

@media screen and (max-width: 1024px) and (orientation: landscape){

/* "Überflüssige" Elemente ausgeblendet und auf width und height: 0 gesetzt*/

}

Allerdings ist dann immer noch die Adressleiste vom Browser zu sehen. Die könnte ich bestimmt mit Javascript u.a. auch noch weg bekommen, aber ich vermute dass es da doch bestimmt insgesamt eine saubere/elegantere Lösung für gibt oder?

Gruß ebody

  1. Hey,

    Die Console gibt dann aber immer folgenden Hinweis:

    Failed to execute 'requestFullscreen' on 'Element': API can only be initiated by a user gesture.

    Allerdings ist dann immer noch die Adressleiste vom Browser zu sehen. Die könnte ich bestimmt mit Javascript u.a. auch noch weg bekommen, aber ich vermute dass es da doch bestimmt insgesamt eine saubere/elegantere Lösung für gibt oder?

    Nein, Vollbildschirm geht nur durch Usereingabe bzw Bestätigung. Man könnte da ein wenig mogeln aber das wäre dann nicht sauber geschweige denn elegant.

    Gruß
    Jo

    1. Hallo,

      bei youtube funktioniert es. Öffne ich die Seite, klicke auf Play und drehe das Smartphone wird das Video im Vollbildmodus angezeigt.

      Ich weiß jetzt nur nicht wirklich, ob youtube da etwas trickst oder nicht.

      Gruß ebody

      1. Hey,

        bei youtube funktioniert es. Öffne ich die Seite, klicke auf Play und drehe das Smartphone wird das Video im Vollbildmodus angezeigt.

        Ich weiß jetzt nur nicht wirklich, ob youtube da etwas trickst oder nicht.

        Im Browser oder der App?

        Gruß
        Jo

        1. Hi,

          Browser + App.

          Gruß ebody

          1. Hey,

            Stimmt, ist mir noch gar nicht aufgefallen. Aber anscheinend funktioniert das für ein Video Element.

            Trotzdem sollte man da eher vorsichtig sein und ein click Event abfragen, als einfach etwas zu machen, was möglicherweise nicht im Sinne des Nutzers ist.

            Gruß
            Jo