Ich versuche es mal hier. Dazu ist das Forum ja da.
(außerdem steht deine Mailadresse ja im Impressum) ;-)
Ja, das mit den Formaten ist doof. Ändern können wir das nicht. Du kannst also mitspielen (also zwei Formate nehmen) oder dich für
eins entscheiden. Mozilla schreibt auch, dass mp4 unter gewissen Umständen (Vorhandensein eines Decoders) auch im FF
funktioniert.
Minimallösung:
<video controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.webm" type="video/webm">
</video>
Vor movie musst du ggf. noch den Pfad einfügen, also z.b. media/rigoe1.mp4 wenn die Videodatei in einem anderen Verzeichnis liegt,
als die html-Datei.
Mehr musst du nicht tun. Der Browser kümmert sich drum.
Auf der o.g. Seite zum Video-Tag gibt es auch einen grünen Button, der zu einer Demo-Seite verlinkt. Hier sieht man, wie das Ergebnis
aussehen kann.
Ein Blick unter die Haube (in den Quelltext) zeigt dir, wie es gemacht wird:
1 <video id="video" controls poster="videos/lechner_480x360_tq.mp4_35_66.jpg">
2 <source id='mp4' src="videos/lechner_480x360_tq.mp4_35_66.mp4" type="video/mp4">
3 <source id='webm' src="videos/lechner_480x360_tq.mp4_35_66.webm" type="video/webm">
4 <track src="videos/untertitel.vtt" kind="subtitles" srclang="de" label="Deutsch" default >
5 <track src="videos/caption.vtt" kind="descriptions" srclang="de" label="Deutsch" >
6 <p class="warnung">Falls Ihr Browser das Video nicht anzeigen kann,
7 <br />können Sie es stattdessen <a href="videos/lechner_480x360_tq.mp4_35_66.mp4">hier herunterladen</a></p>
8</video>
Ich habe mal Zeilennummern davor geschrieben.
Zeile 1: id="video" frei wählbarer Name des video-Blockes
controls schaltet die Bedienelemente ein
poster ist ein Bild, dass angezeigt wird, solange die Wiedergabe noch nicht gestartet ist
Zeile 2: Quelle 1 im mp4-Format mit eigener id, Pfad zur Videodatei und dem Typ
Zeile 3: Quelle 2 im webm-Format
Zeile 4: Untertitel, die aus einer Textdatei geladen werden, mit "CC"-Button aus- oder einschalten
webdesign.weisshart.de/videos/untertitel.vtt
Zeile 5: Beschreibung des Videos, auch eine Textdatei
webdesign.weisshart.de/videos/caption.vtt
Zeilen 6 und 7: alternativer Text, falls der Browser das Video nicht anzeigen kann.
Ich würde mit der mp4-Datei anfangen und die Zeilen 3-5 erstmal weglassen. Wenn das klappt, kannst du mit den Einstellungen
Hier ist noch eine weitere Seite, wo auch noch genauer auf die möglichen Optionen und Probleme eingegangen wird.
www.html-seminar.de/html-5-video.htm
Dass hier das nächste Videoformat ins Spiel kommt, kannst du ignorieren. Die Seite ist von 2010.
Gruß Flupo
