0 votes
in SoSci Survey (dt.) by s106856 (110 points)
edited by SoSci Survey

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!

1 Answer

0 votes
by SoSci Survey (324k points)

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.

Willkommen im Online-Support von SoSci Survey.

Hier bekommen Sie schnelle und fundierte Antworten von anderen Projektleitern und direkt von SoSci Survey.

→ Eine Frage stellen


Welcome to the SoSci Survey online support.

Simply ask a question to quickly get answers from other professionals, and directly from SoSci Survey.

→ Ask a Question

...