Element-Referenz
HTML 5 doctype - weil html einfach einfach ist.
nach oben

<video>NEU

Bislang standen zur Wiedergabe von Medieninhalten nur sehr rudimentäreInformationBedeutung: rudimentäreunvollständig, unvollkommen, nur in Ansätzen [vorhanden], unzureichend Lösungen in HTML zur Verfügung. Mit dem HTML5 <video> Element ist nun das Abspielen einer Vielzahl von Medieninhalten in HTML möglich und dies ohne die bisher genutzten Adobe Flash oder Plug-Ins von Drittanbietern.

Die native Unterstützung von multimedialen Inhalten scheitert in der praktischen Anwendung am Format. Die lizenzrechtlichen Bedenken der Browserhersteller führten dazu, dass man sich auf keinen Standard bezüglich des Formats einigen konnte, eigentlich war das lizenzfreie ogg Format vorgesehen. Für das HTML5 <video> Element sind somit drei Video-Standards notwendig, von denen allerdings nicht jedes der Formate Ogg (Theora), MPEG4 (H.264), WebM (VP8) von jedem Browser unterstützt wird. Bei der Einbindung des <video> Elements müssen daher mindestens zwei Formate definiert werden, aus denen der jeweilige Browser das von ihm ausgabefähige Format auswählt.

BrowserOggMP4WebM
Internet Explorer 11
Firefox 38.0
Chrome 43.0
Safari 8.0
Opera 29
SUPERInformationBedeutung: SUPERSimplified Universal Player Encoder & Renderer © ist ein kostenloses Konvertierungs-Programm für nahezu alle Audio- und Videoformate. Die Freeware kann Musikdateien und Videos in alle wichtigen Formate umwandeln.

Beispiel:

<video src="/video-datei.ogg" type="video/ogg" controls="controls" poster="video.png">
Der Video-Tag wird von Ihrem Browser nicht unterstützt.
</video>
elementspezifischen Attribute
AttributBeschreibung
audioWenn der Wert "muted" gesetzt, ist der Ton stummgeschaltet
autoplayMedieninhalt direkt beim Laden abspielen
controlsBrowsertypische Kontrollleiste anzeigen
heightDefiniert die Höhe des Videos
loopMedieninhalt endlos wiedergeben
posterBild welches bis zum Abspielvorgang angezeigt wird
preloadMedieninhalt bei Seitenaufruf vorladen
srcGültige URL zum jeweiligen Medieninhalt
widthDefiniert die Breite des Videos

Beispiel:

<video width="440" height="320" controls="controls" autoplay loop>
<source src="/video-datei.webm" type="video/webm" />
<source src="/video-datei.ogg" type="video/ogg" />
<source src="/video-datei.mp4" type="video/mp4" />
// <!-- Flash als Fallback-Lösung -->
<embed src="/video-datei.swf" type="application/x-shockwave-flash">
Der Video-Tag wird von Ihrem Browser nicht unterstützt.
</video>

Notation

<video [Attribute]>[Elementinhalt]</video>

Elternelemente

Kann gemäß der HTML5 Spezifikation innerhalb der folgenden Elemente vorkommen:

Liste der HTML 5 Block-ElementeBlock-Elemente und Liste der HTML 5 Inline-ElementeInline-Elemente .


Elementinhalt

Kann Text mit folgenden anderen HTML-Elementen enthalten:
zum <source> Element<source> und zum <track> Element<track>.


Attribute

Kann folgende elementspezifische Attribute enthalten:
zum HTML5 Attribut audioaudio | zum HTML5 Attribut controlscontrols | zum HTML5 Attribut heightheight | zum HTML5 Attribut looploop | zum HTML5 Attribut posterposter | zum HTML5 Attribut preloadpreload | zum HTML5 Attribut srcsrc | zum HTML5 Attribut widthwidth

Des Weiteren kann das Element folgende allgemeinen Attribute und Event-Handler enthalten:
zum HTML5 Attribut accesskeyaccesskey | zum HTML5 Attribut classclass | zum HTML5 Attribut contenteditablecontenteditable | zum HTML5 Attribut contextmenucontextmenu | zum HTML5 Attribut datadata | zum HTML5 Attribut dirdir | zum HTML5 Attribut draggabledraggable | zum HTML5 Attribut hiddenhidden | zum HTML5 Attribut idid | zum HTML5 Attribut itemitem | zum HTML5 Attribut itempropitemprop | zum HTML5 Attribut langlang | zum HTML5 Attribut spellcheckspellcheck | zum HTML5 Attribut stylestyle | zum HTML5 Attribut subjectsubject | zum HTML5 Attribut tabindextabindex | zum HTML5 Attribut titletitle

onabort | onblur | oncanplay | oncanplaythrough | onchange | onclick | oncontextmenu | ondblclick | ondrag | ondragend | ondragenter | ondragleave | ondragover | ondragstart | ondrop | ondurationchange | onemptied | onerror | onfocus | onkeydown | onkeypress | onkeyup | onloadeddata | onloadedmetadata | onloadstart | onmousedown | onmousemove | onmouseout | onmouseover | onmouseup | onmousewheel | onpause | onplay | onplaying | onprogress | onratechange | onreadystatechange | onscroll | onstalled | onsuspend | ontimeupdate | onvolumechange | onwaiting


W3C Logo Spezifikation

Tastaturkürzel