[Web] Menyajikan Video dan Animasi pada Halaman Web
Untuk menampilkan
video pada halaman
web dapat ditangani
secara langsung oleh
HTML5. Tag yang digunakan untuk menampilkan video adalah <video> </video>. Namun
tidak semua format
videonya dapat ditampilkan
di web. Format video yang bisa diproses, di antaranya
adalah WebM ,OGG , MP4. Berikut daftar ke kompabilitasan dari
masing-masing browser terhadap file video :
Kompabilitas Browser |
MIME untuk format Video
MIME (Multipurpose
Internet Mail Extension)
digunakan untuk mekanisme
untuk
mengirim berbagai
informasi seperti text,
aplikasi, gambar, suara,
video, dan lain
sebagainya
agar browser tidak salah menterjemahkan konten yg diterima.
MIME untuk format video |
Tag
<video> memiliki beberapa atribut
Berikut
ini adalah atribut – atribut yang digunakan pada tag <video> :
Sumber : Buku pegangan siswa “pemrograman web”
Tag-tag pada <video> |
Menyajikan
Animasi pada Halaman Web
File
animasi juga dapat ditampilkan pada halaman web dengan cara di embed-kan. Embed
digunakan untuk melampirkan file dari eksternal seperti *.swf dan lain-lain
sebagainya. Perintah yang digunakan adalah
<embed
src="siboy.swf">
Berikut ini code html untuk
menyajikan video dan animasi ke dalam halaman web :
*simpan file html di dalam folder yang sama dengan file audio yang akan
disajikan pada halaman web
<html>
<head>
<title>Cek
video</title>
</head>
<body>
<h3>
Menyajikan Video dan Animasi pada Halaman Web</h3>
<br/>
<video
width="500" height="281" controls
poster="be(jpg)better.jpg" loop="loop">
<source
src="mummy.mp4" type="video/mp4">
</video>
<br/>
<h3>
Menyajikan animasi pada halaman web</h3>
<embed
src="games_Scene 1.swf" width="50"
height="50">
</body>
</html>
Tampilan pada halaman web :
Menyajikan Video dan Animasi pada Halaman Web |
Sumber : Buku pegangan siswa “pemrograman web”
[RS]
Klik Like & Share jika postingan ini bermanfaat
Apa tanggapan Anda?
Berikan tanggapan Anda melalui kolom komentar yang telah disediakan.
- Gunakan bahasa yang sopan;
- Saat menjadikan postingan pada blog ini sebagai referensi, jangan lupa mencantumkan sumbernya (link dari blog ini).
Jika blog ini bermanfaat jangan lupa memberikan 'like' atau 'share' untuk mendapatkan update terbaru.
Terima kasih