HTML5-Video auf Klick in Vollbild anzeigen lassen

Question

Hallo,
ich würde gerne mein mit nach der Anleitung für Einbindung von HTML5-Videos die optimierte Eindung noch gerne um die Funktion erweitern, dass das Video auf Klick in Vollbild abgespielt wird, sodass der Nutzer das nicht mehr manuell machen muss.

Wie kann ich das zum Code der optimierten Einbindung hinzufügen? Ich habe bereits mehrere HTML-Codes aus dem Internet versucht, welche allerdings alle nicht funktioniert haben.
Das ist meine Code bisher. (100% bei Video Width und Height resultiert auch nicht in Vollbild):

<video width="512" height="288" controls controlsList="nodownload" id="stimulus">
  <source src="dateiname.ogg" type="video/ogg" />
  <source src="dateiname.mp4" type="video/mp4" />
  <source src="dateiname.webm" type="video/webm" />
</video>

<script type="text/javascript">    
var video = document.getElementById("stimulus");
 
// Bedienelemente ausblenden, sobald es abspielt
SoSciTools.attachEvent(video, "play", function(evt) {
  stimulus.removeAttribute("controls");
});
// Weiter-Knopf ausblenden
SoSciTools.attachEvent(window, "load", function(evt) {
  SoSciTools.submitButtonsHide();
});
// Weiter-Knopf am Ende des Videos wieder anzeigen
SoSciTools.attachEvent(stimulus, "ended", function(evt) {
  SoSciTools.submitButtonsDisplay();
});
</script>

Vielen Dank für Ihre Hilfe!

Answer 1

Sie hatten anderweits noch gefragt, weshalb die Kontrollelemente verschwinden - dafür ist die folgende Zeile verantwortlich:

stimulus.removeAttribute("controls");

Ob der Browser den Fullscreen-Modus erlaubt, hängt vom Browser ab und kann sich von Version zu Version ändern. Hier ein paar Zeilen JavaScript von StackOverflow:

var elem = document.getElementById("stimulus");
if (elem.requestFullscreen) {
  elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
  elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
  elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { 
  elem.msRequestFullscreen();
}

Diese können Sie z.B. unter oder anstatt dem stimulus.removeAttribute("controls"); platzieren.