Video joacă în HTML
Înainte de HTML5, nu a existat nici un standard pentru afișarea video pe o pagină web.
Înainte de HTML5, video ar putea fi jucat doar cu un plug-in (like flash) .
HTML5 <video> element specifică un mod standard de a încorpora un video într - o pagină web.
Suport pentru browser-
Numerele din tabel specifica prima versiune de browser care acceptă pe deplin <video> element.
| Element | |||||
|---|---|---|---|---|---|
| <video> | 4 | 9 | 3.5 | 4 | 10.5 |
HTML <video> Element
Pentru a afișa un video în HTML, utilizați <video> elementul:
Exemplu
<video width="320" height="240" controls>
<source src="/html/movie.mp4" type="video/mp4">
<source src="/html/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Încearcă - l singur » Cum functioneaza
De controls atribut adaugă comenzi video cum ar fi redare, pauză, și volumul.
Este o idee bună să includă întotdeauna width și height atribute.
În cazul în care înălțimea și lățimea nu sunt setate, browser-ul nu cunoaște dimensiunea videoclipului. Efectul va fi că pagina se va schimba (or flicker) , în timp ce sarcinile video.
Textul dintre <video> și </video> tag - uri vor fi afișate numai în browsere care nu acceptă <video> element.
Multiple <source> elemente pot conecta la diferite fișiere video. Browserul va utiliza primul format recunoscut.
HTML <video> Autoplay
Pentru a porni un videoclip utiliza automat autoplay atributul:
Exemplu
<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>
Încearcă - l singur » autoplay atribut nu funcționează în dispozitive mobile cum ar fi iPad și iPhone.
HTML Video - Suport pentru browser
În prezent, există 3 formate video suportate pentru <video> element: MP4, WebM și Ogg:
| Browser | MP4 | WebM | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | NO | NO |
| Opera | YES (from Opera 25) | YES | YES |
HTML video - Tipuri de media
| Tipul fisierului | Tip media |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
HTML Video - Metode, proprietăți și evenimente
HTML5 definește metodele DOM, proprietăți și evenimente pentru <video> element.
Acest lucru vă permite să încărcați, să redați și să întrerupeți clipuri video, precum și durata și volumul setare.
Există, de asemenea, evenimente DOM pe care le poate notifica atunci când un film începe să joace, este întreruptă, etc.
Pentru o referință DOM completă, du - te la nostru HTML5 audio / video DOM de referință .
HTML5 Video Tag-uri
| Etichetă | Descriere |
|---|---|
| <video> | Definește un videoclip sau un film |
| <source> | Definește mai multe resurse media pentru elemente media, cum ar fi <video> și <audio> |
| <track> | Definește piese de text în playere media |