Hallo,
Dein erster Fehler liegt darin, dass Du ja zwei Videos einbindest (leider hat das zweite nur controls, aber keinen Inhalt)
Um ein responsives Video einzubinden, solltest Du die Dokumentation von bootstrap heranziehen (LimeSurvey basiert ja auf der bootstrap-Bibliothek)
[url]
getbootstrap.com/docs/5.3/content/images/
[/url]
Hier zwar für Bilder; Du musst aber nur stattdessen den <video> tag einsetzen.
Soll heißen, dies würde ausreichen:
Code:
<video class="img-fluid" controls autoplay>
<source src="/upload/surveys/757777/files/video1.mov" />
Browser unterstützt dieses Format nicht.
</video>
Ich würde das Ganze wohl noch mit einem
<div class="text-center">
...
</div>
umschließen, um etwas mehr Konrolle über die Platzierung zu haben (hier wird es eben zentriert.
Und "Startbutton"?
Da Du ja keine Rechte hast "javascript" einzusetzen, ist dies nicht möglich; dafür sind ja die "controls" eingeblendet.
Andererseits könntest Du auch ein Konstrukt aus bootstrap 3 benutzen, dass in bootstrap 5 nicht mehr unterstützt wird, aber trotzdem funktioniert
Code:
<div class="embed-responsive embed-responsive-16by9 text-center">
<video class="embed-responsive-item img-fluid" controls=""><source src="/upload/surveys/757777/files/video1.mov" /> browser unterstützt dieses Format nicht.</video>
</div>
Dann wird beim Start der dicke Button im Video gezeigt (zumindest in Firefox)
Joffm
P.S. In bootstrap 5 heißt es jetzt "ratio", scheint aber nicht so ganz optimal zu sein.
Aber Du kannst ja einmal gucken.
[url]
getbootstrap.com/docs/5.3/helpers/ratio/
[/url]