Menyajikan file Video pada tampilan Web - Catatan Faiq Hisyam Marwan

Contact Form

 

Menyajikan file Video pada tampilan Web

Menyajikan file Video pada tampilan web
File  video seperti mp4 dapat dimainkan pada halaman web melalui tag<video> < /video>.  Ketika mencoba menjalankan video pada halaman web , file video ditempatkan dalam satu folder yang sama dengan file *.htm dan nama file audio nya disesuaikan dengan file audio yang anda gunakan.Berikut adalah format lengkap untuk memainkan video ke dalam aplikasi web
<html>
<head>
<title>cek video</title>
</head>
<body>
 <video width="320" height="240" controls>
  <source src="bola.mp4" type="video/mp4">
browser anda tidak mendukung format video ini.
</video>
</body>
</html>

Atribut Height dan Width dalam tag <video> digunakan untuk menentukan tinggi dan lebar penampilan video. Atribut Src  menentukan file  video.
Bila listing program diatas dijalankan akan menghasilkan tampilan video di browser chrome . Tekan tombol play untuk memulai menjalankan videonya

Bila dijalankan akan menghasilkan tampilan video di browser mozilla firefox, video tidak akan muncul hal ini dikarenakan browser mozilla firefox tidak mendukung format file *.mp4.

Tag <video> memiliki beberapa atribut, tidak hanya width dan height saja. Kontrol atribut menambahkan kontrol video, seperti play, pause, dan volume. Berikut ini adalah atribut – atribut yang digunakan pada tag <video>.
Atribut
Sintaks
Deskripsi
<video autoplay="autoplay">
Memulai secara otomatis video
<video controls = "controls" >
Atau juga bisa ditulis
<video controls>
menampilkan tombol kontrol video
height
<video height="240">
mengatur tinggi frame video
<video width="320">
mengatur lebar frame video
<video loop=”loop”>
Memutar video secara berulang-ulang
<video muted=”muted”>
mematikan fungsi suara pada video
<video poster="anak.gif">
memunculkan poster/gambar pada saat video buffer atau diunduh.
<video preload="preload">
memuat ulang video
<source src="bola.mp4" type="video/mp4">
memberikan link video


Total comment

Author

Faiq Hisyam Marwan

0   comments

Cancel Reply