j4nk3y: Javascript toggleFullscreen

Salve!

vor ein paar Wochen habe ich nach einer Möglichkeit gesucht, dem Client die Möglichkeit zu geben das Browserfenster im Vollbildmodus darzustellen. Nach ein wenig Recherche kam dann folgende Funktion dabei heraus:

function toggleFullScreen(elem) {
	if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) ||
	(document.msFullscreenElement !== undefined && document.msFullscreenElement === null) ||
	(document.mozFullScreen !== undefined && !document.mozFullScreen) ||
	(document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
		if (elem.requestFullScreen) {
			elem.requestFullScreen();
		} else if (elem.mozRequestFullScreen) {
			elem.mozRequestFullScreen();
		} else if (elem.webkitRequestFullScreen) {
			elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
		} else if (elem.msRequestFullscreen) {
			elem.msRequestFullscreen();
		}
	} else {
		if (document.cancelFullScreen) {
			document.cancelFullScreen();
		} else if (document.mozCancelFullScreen) {
			document.mozCancelFullScreen();
		} else if (document.webkitCancelFullScreen) {
			document.webkitCancelFullScreen();
		} else if (document.msExitFullscreen) {
			document.msExitFullscreen();
		}
	}
}

Diese konnte/habe ich dann, über einen Button Click, eine ganze Zeit wie folgt aufgerufen:

toggleFullScreen(document.body);

Funktionierte erstmal aber es traten noch kleinere Probleme auf. Zum Beispiel erstens: Hintergrundfarbe des HTML änderte sich auf Weiß.

Gestern habe ich mich dann der Problematik angenommen. Erstes konnte ich dann simpel mit CSS (html:fullscreen), und den entsprechenden für die anderen Browser, beheben. Wie das so ist, trat gleich das nächste Problem auf. Das <canvas>-Element welches den <body> vollständig ausfüllt und dessen Inhalt per Mausevent steuerbar ist, war im Vollbildmodus nicht mehr steuerbar. Dann dachte ich, ich bin auf die glorreiche Idee gekommen, einfach das zu togglende Element zu verändern, also kurzerhand das "größte"/"umfassendste" Element gesetzt welches ich kenne:

toggleFullScreen(document);

Ausprobiert: Funktioniert... Hurray!

Dann die Ernüchterung, es funktionierte genau einmal. Danach funktioniert es gar nicht mehr, egal welches Element ich der Funktion übergebe und ich habe ehrlich gesagt keinen blassen Dunst warum!?

Und um es schon mal vorweg zu nehmen: Nein ich bekomme keine Fehlermeldung in der Console und nein der Debugger sagt auch nichts.

Noch ein kleiner Nachtrag. Ich habe gerad noch einmal ein wenig probiert und hab die Timeline vom Debugger geöffnet und das Element nochmal zu document.body geändert. Plötzlich ging es wieder, mit dem Problem, dass sich die Hintergrundfarbe geändert hat, da habe ich aber schon eine Idee. Danach dann wieder auf document gewechselt und siehe da, es funktioniert wieder gar nicht, auch nicht nach dem erneuten wechsel zu document.body.

Hat irgendjemand eine die Erleuchtung für mich?

Gruß
Jo

  1. Hallo j4nk3y,

    Hat irgendjemand eine die Erleuchtung für mich?

    Ohne einen Link zur Seite wird das wohl nichts.

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
    1. Hey,

      Hat irgendjemand eine die Erleuchtung für mich?

      Ohne einen Link zur Seite wird das wohl nichts.

      Ein Link zu Localhost bringt leider nicht viel. Ich bekomme Morgen meinen Server dann überlege ich mir wie ich das mit einem teilweise öffentlichen Zugang mache.

      Gruß
      Jo

      1. Hallo j4nk3y,

        Ein Link zu Localhost bringt leider nicht viel.

        http://www.bplaced.net

        Bis demnächst
        Matthias

        --
        Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
        1. Hey,

          http://www.bplaced.net

          Yes, schon einige male hier gesehen, aber ich bin noch nicht bereit mein Projekt öffentlich und frei zugänglich zu präsentieren. Im Laufe der nächsten Woche sollte ich aber in der Lage sein per openVPN auf meinen Server zuzugreifen und es teilweise öffentlich zu machen.

          Gruß
          Jo

          1. Hallo j4nk3y,

            Yes, schon einige male hier gesehen, aber ich bin noch nicht bereit mein Projekt öffentlich und frei zugänglich zu präsentieren.

            Du musst weder das eine noch das andere tun, nur ein - gern auf das Wesentliche reduziertes - online-Beispiel bereitstellen.

            Bis demnächst
            Matthias

            --
            Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
            1. Hey,

              Du musst weder das eine noch das andere tun, nur ein - gern auf das Wesentliche reduziertes - online-Beispiel bereitstellen.

              Nun denn, ein Fiddle. Also bei mir funktioniert im Moment kein Button.

              Gruß
              Jo

              1. Hallo j4nk3y,

                auf https://davidwalsh.name/fullscreen liest sich das ganz einfach.

                Bis demnächst
                Matthias

                --
                Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
                1. Hey,

                  auf https://davidwalsh.name/fullscreen liest sich das ganz einfach.

                  Ja den hatte ich damals auch Überflogen und hab dann auch noch etwas auf StackOverflow gefunden. "Finde es gerade nicht wieder". Aber ich habe ein Jquery Plugin gefunden. Das werde ich wohl morgen mal ausprobieren.

                  Gruß
                  Jo

              2. Servus!

                Nun denn, ein Fiddle.

                Hättest du Lust, wenn du ein funktionsfähiges Beispiel zusammen bekommen hast, den angefangenen Wiki-Artikel

                zu erweitern?

                Vielen Dank im Voraus!

                Herzliche Grüße

                Matthias Scharwies

                --
                Es gibt viel zu tun: ToDo-Liste
                1. Hey,

                  Hättest du Lust, wenn du ein funktionsfähiges Beispiel zusammen bekommen hast, den angefangenen Wiki-Artikel

                  zu erweitern?

                  Welch eine Ehre. Da lässt sich sicher was schreiben, sobald ich Zeit finde und verstehe warum meine Funktion nur bedingt Funktioniert.

                  Gruß
                  Jo