Zusammenfassung des Grundwissens über HTML5-Videos

1. Grundlegende Attribute des Video-Tags

1.autoplay="autoplay": Legt fest, dass das Video abgespielt wird, sobald es fertig ist

2.control="controls ": Lassen Sie den Browser das Video abspielen. Der Player bietet Standardsteuerelemente wie Pause und Fortschrittsbalken. Wenn dies eingestellt ist, können Sie keine eigenen Steuerelemente verwenden.

3.width="320" height="240": Definieren Sie die Breite und Höhe des Videoplayers. Wenn Sie dies festlegen, kann die Seite einen Teil des Platzes für den Videoplayer reservieren. Wenn dies nicht festgelegt ist, wird dieser zu Beginn nicht beibehalten, was zu Verwirrung im Seitenlayout führen kann 4.loop="loop": legt fest, dass die Wiedergabe des Videos dann fortgesetzt wird

5.preload-Attribut: automatisch bedeutet, dass das gesamte Video geladen wird, nachdem die Seite geladen wurde; keine: lädt nicht das Video

6.src: Vorschriften-URL zum Abspielen des Videos, unterstützte Videoformate: MP4/WebM/Ogg

2. Gemeinsame Video

1.

Zeit: Gibt die aktuelle Wiedergabezeit an, die durch js-Operationen geändert und im Wiedergabefortschritt widergespiegelt werden kann2.load()-Methode: Video laden; Methode play(): Video abspielen; Methode pause(): Video anhalten

3.Lautstärke: Zeigt die aktuelle Tongröße an, die über js angepasst werden kann

4 .muted: true bedeutet stumm, false bedeutet nicht stummgeschaltet

5.playbackRate: Stellen Sie die Wiedergabegeschwindigkeit ein. Der Standardwert ist 1, was bedeutet, dass die Wiedergabe in 1 Sekunde erfolgt.

3. Verwenden Sie js zur Steuerung die Videoinstanz

und rufen Sie das entsprechende < über den

ab. ;video> Element: var myVideo = document.getElementById(“video”)myVideo.play(): Wiedergabe des Videos starten; myVideo.pause(): Wiedergabe des Videos stoppen

Sie können die Größe des Videos über myVideo.height und myVideo.width festlegen

4. Das Quell-Tag

<video id=“video” width=“420”>
    <scource src=“a.mp4” type=“video/mp4”>
    <scource src=“a.ogg” type=“video/ogg”>
</video>

1

2 .

3

4.

5.

Das obige ist der detaillierte Inhalt vonZusammenfassung des Grundwissens über HTML5-Videos. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!