Belajar HTML lagi yukk. kali ini, The Precious akan membahas tentang cara menginputkan video di HTML. Dan sumbernnya masih dari w3schools. Oke langsung aja yaa, check it out! ^_^
Memutar Video di HTML
Sebelum HTML5, tidak ada standar untuk memainkan video di
suatu halaman web.
Sebelum HTML5, video hanya dapat diputar dengan plug-in
(seperti flash).
Elemen HTML5 <video>
menetapkan cara standar untuk meletakkan video didalam web.
Browser Pendukung
Nomor didalam tabel penetapan browser versi pertama adalah
yang mendukung secara penuh elemen
<video>
Elemen <video> HTML
Untuk menampilkan video di HTML, gunakan elemen
<video>:
Bagaimana HTML bekerja
Controls Attribute menambahkan pengaturan video, seperti
play, pause, dan volume.
Ini adalah ide yang bagus untuk selalu memasukkan atribut
width dan height.
Jika height dan width tidak diatur, browser tidak tahu
ukuran video tersebut. Akibatnya, halaman web tersebut akan berubah (atau
berkelap-kelip) saat memuat video.
Teks diantara tag <video> dan </video> hanya
akan memperlihatkan pada browser yang tidak mendukung elemen <video>
Elemen multiple <source> dapat terhubung dengan file
video yang berbeda. Browser akan menggunakan format pertama yang dikenali.
HTML <video> Autoplay
Untuk memulai video secara otomatis, gunakan atribut
autoplay seperti dibawah ini:
<!DOCTYPE
html>
<html>
<body>
<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>
</body>
</html>
Namun, atribut autoplay tidak bekerja di Safari dan Opera,
atau di perangkat seluler seperti iPad dan iPhone.
HTML Video-Browser Support
Sekarang ini, ada 3 format video yang mendukung elemen
<video> yaitu: MP4, WebM, dan Ogg:
HTML Video-Media Types
HTML Video-Methods, Properties, dan Events
HTML5 menetapkan metode DOM, properties, dan events untuk
elemen <video>.
Ini memgizinkanmu untuk memuat, memainkan, dan menjeda video
sebaik mengatur durasi dan volume.
Ada juga DOM events yang akan memberitahumu saat video mulai
dimainkan, dijeda, dll.
HTML5 Video Tags
Tag
|
Deskripsi
|
<video>
|
Mendefinisikan sebuah video atau film
|
<source>
|
Mendefinisikan sumber multiple media untuk media elemen
seperti <video> dan <audio>
|
<track>
|
Menampilkan tracks di media players
|
0 komentar:
Posting Komentar