HTML - Sematkan Multimedia
Terkadang Anda perlu menambahkan musik atau video ke halaman web Anda. Cara termudah untuk menambahkan video atau suara ke situs web Anda adalah dengan menyertakan tag HTML khusus yang disebut<embed>. Tag ini menyebabkan browser itu sendiri menyertakan kontrol untuk multimedia yang secara otomatis disediakan browser mendukung tag <embed> dan jenis media yang diberikan.
Anda juga bisa memasukkan file <noembed>tag untuk browser yang tidak mengenali tag <embed>. Anda dapat, misalnya, menggunakan <embed> untuk menampilkan film pilihan Anda, dan<noembed> untuk menampilkan gambar JPG tunggal jika browser tidak mendukung tag <embed>.
Contoh
Berikut adalah contoh sederhana untuk memutar file midi yang disematkan -
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.mid" width = "100%" height = "60" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Atribut Tag <embed>
Berikut adalah daftar atribut penting yang dapat digunakan dengan tag <embed>.
Note−Atribut align dan autostart tidak digunakan lagi di HTML5. Jangan gunakan atribut ini.
| Sr Tidak | Atribut & Deskripsi |
|---|---|
| 1 | align Menentukan cara meratakan objek. Ini dapat diatur ke tengah, kiri atau kanan . |
| 2 | autostart Atribut boolean ini menunjukkan apakah media harus dimulai secara otomatis. Anda dapat menyetelnya menjadi benar atau salah. |
| 3 | loop Menentukan apakah suara harus dimainkan terus menerus (set loop ke true), beberapa kali (nilai positif) atau tidak sama sekali (salah) |
| 4 | playcount Menentukan berapa kali memainkan suara. Ini adalah opsi alternatif untuk loop jika Anda menggunakan IE. |
| 5 | hidden Menentukan apakah objek multimedia harus ditampilkan di halaman. Nilai salah berarti tidak dan nilai benar berarti ya. |
| 6 | width Lebar objek dalam piksel |
| 7 | height Ketinggian objek dalam piksel |
| 8 | name Nama yang digunakan untuk mereferensikan objek. |
| 9 | src URL objek yang akan disematkan. |
| 10 | volume Mengontrol volume suara. Bisa dari 0 (mati) hingga 100 (volume penuh). |
Jenis Video yang Didukung
Anda dapat menggunakan berbagai jenis media seperti film Flash (.swf), AVI (.avi), dan jenis file MOV (.mov) di dalam tag embed.
.swf files - adalah jenis file yang dibuat oleh program Flash Macromedia.
.wmv files - adalah jenis file Media Video Microsoft Window.
.mov files - adalah format Film Waktu Cepat Apple.
.mpeg files - adalah file film yang dibuat oleh Moving Pictures Expert Group.
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.swf" width = "200" height = "200" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Ini akan menghasilkan hasil sebagai berikut -
Audio Latar Belakang
Anda bisa menggunakan HTML <bgsound>tag untuk memutar trek suara di latar belakang laman web Anda. Tag ini hanya didukung oleh Internet Explorer dan sebagian besar browser lain mengabaikan tag ini. Ini mengunduh dan memainkan file audio ketika dokumen host pertama kali diunduh oleh pengguna dan ditampilkan. File suara latar belakang juga akan diputar ulang setiap kali pengguna menyegarkan browser.
Note- Tag bgsound tidak digunakan lagi dan seharusnya dihapus di versi HTML mendatang. Jadi sebaiknya tidak digunakan, disarankan untuk menggunakan audio tag HTML5 untuk menambahkan suara. Namun tetap untuk tujuan pembelajaran, bab ini akan menjelaskan tag bgsound secara detail.
Tag ini hanya memiliki dua atribut loop dan src . Kedua atribut ini memiliki arti yang sama seperti yang dijelaskan di atas.
Berikut adalah contoh sederhana untuk memainkan file midi kecil -
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<bgsound src = "/html/yourfile.mid">
<noembed><img src = "yourimage.gif" ></noembed>
</bgsound>
</body>
</html>Ini akan menghasilkan layar kosong. Tag ini tidak menampilkan komponen apa pun dan tetap tersembunyi.
Internet Explorer juga dapat menangani hanya tiga file format suara yang berbeda - wav, format asli untuk PC; au, format asli untuk kebanyakan workstation Unix; dan MIDI, skema pengkodean musik universal.
Tag Objek HTML
HTML 4 memperkenalkan <object>elemen, yang menawarkan solusi serba guna untuk penyertaan objek umum. Itu<object> elemen memungkinkan penulis HTML untuk menentukan semua yang dibutuhkan oleh suatu objek untuk presentasi oleh agen pengguna.
Berikut beberapa contoh -
Contoh 1
Anda dapat menyematkan dokumen HTML dalam dokumen HTML itu sendiri sebagai berikut -
<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
alt : <a href = "data/test.htm">test.htm</a>
</object>Di sini atribut alt akan muncul jika browser tidak mendukung tag objek .
Contoh - 2
Anda dapat menyematkan dokumen PDF dalam dokumen HTML sebagai berikut -
<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
alt : <a href = "data/test.pdf">test.htm</a>
</object>Contoh - 3
Anda dapat menentukan beberapa parameter yang terkait dengan dokumen dengan <param>menandai. Berikut adalah contoh untuk menyematkan file wav -
<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
<param name = "src" value = "data/test.wav">
<param name = "autoplay" value = "false">
<param name = "autoStart" value = "0">
alt : <a href = "data/test.wav">test.wav</a>
</object>Contoh - 4
Anda dapat menambahkan dokumen flash sebagai berikut -
<object classid = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id = "penguin"
codebase = "someplace/swflash.cab" width = "200" height = "300">
<param name = "movie" value = "flash/penguin.swf" />
<param name = "quality" value = "high" />
<img src = "penguin.jpg" width = "200" height = "300" alt = "Penguin" />
</object>Contoh - 5
Anda dapat menambahkan applet java ke dalam dokumen HTML sebagai berikut -
<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93"
width = "200" height = "200">
<param name = "code" value = "applet.class">
</object>Itu classidatribut mengidentifikasi versi Java Plug-in yang akan digunakan. Anda dapat menggunakan atribut basis kode opsional untuk menentukan apakah dan bagaimana mendownload JRE.