HTML -video
Die HTML <video>-element word gebruik om 'n video op 'n webblad te wys.
Die HTML <video> Element
Om 'n video in HTML te wys, gebruik die <video>element:
Voorbeeld
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Hoe dit werk
Die controlskenmerk voeg videokontroles by, soos speel, pouse en volume.
Dit is 'n goeie idee om altyd widthen heighteienskappe in te sluit. As hoogte en breedte nie gestel is nie, kan die bladsy flikker terwyl die video laai.
Die <source>element laat jou toe om alternatiewe videolêers te spesifiseer waaruit die blaaier kan kies. Die blaaier sal die eerste herkende formaat gebruik.
Die teks tussen die <video>en </video>merkers sal slegs vertoon word in blaaiers wat nie die <video>element ondersteun nie.
HTML <video> Outospeel
Om 'n video outomaties te begin, gebruik die autoplaykenmerk:
Voorbeeld
<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Let wel: Chromium-blaaiers laat in die meeste gevalle nie outospeel toe nie. Gedempte outospeel word egter altyd toegelaat.
Voeg mutedna
autoplayby om jou video outomaties te laat speel (maar gedemp):
Voorbeeld
<video width="320" height="240" autoplay muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Blaaierondersteuning
Die nommers in die tabel spesifiseer die eerste blaaierweergawe wat die
<video>element ten volle ondersteun.
| Element | |||||
|---|---|---|---|---|---|
| <video> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
HTML-videoformate
Daar is drie ondersteunde videoformate: MP4, WebM en Ogg. Die blaaierondersteuning vir die verskillende formate is:
| Browser | MP4 | WebM | Ogg |
|---|---|---|---|
| Edge | YES | YES | YES |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML-video - Mediatipes
| File Format | Media Type |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
HTML-video - metodes, eienskappe en gebeure
Die HTML DOM definieer metodes, eienskappe en gebeure vir die <video>element.
Dit laat jou toe om video's te laai, te speel en te onderbreek, asook om tydsduur en volume in te stel.
Daar is ook DOM-geleenthede wat jou in kennis kan stel wanneer 'n video begin speel, onderbreek word, ens.
Vir 'n volledige DOM-verwysing, gaan na ons HTML-oudio/video-DOM-verwysing .
HTML-video-etikette
| Tag | Description |
|---|---|
| <video> | Defines a video or movie |
| <source> | Defines multiple media resources for media elements, such as <video> and <audio> |
| <track> | Defines text tracks in media players |