Audio HTML
Elemen HTML <audio>
digunakan untuk memutar file audio di halaman web.
Elemen HTML <audio>
Untuk memutar file audio dalam HTML, gunakan <audio>
elemen:
Contoh
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Audio HTML - Cara Kerjanya
Atribut controls
menambahkan kontrol audio, seperti putar, jeda, dan volume.
Elemen ini <source>
memungkinkan Anda untuk menentukan file audio alternatif yang dapat dipilih oleh browser. Browser akan menggunakan format pertama yang dikenali.
Teks antara <audio>
dan </audio>
tag hanya akan ditampilkan di browser yang tidak mendukung <audio>
elemen tersebut.
HTML <audio> Putar Otomatis
Untuk memulai file audio secara otomatis, gunakan autoplay
atribut:
Contoh
<audio controls autoplay>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Catatan: Browser Chromium tidak mengizinkan putar otomatis dalam banyak kasus. Namun, putar otomatis tanpa suara selalu diizinkan.
Tambahkan muted
setelah
autoplay
untuk membiarkan file audio Anda mulai diputar secara otomatis (tetapi dibisukan):
Contoh
<audio controls autoplay muted>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung
<audio>
elemen tersebut.
Element | |||||
---|---|---|---|---|---|
<audio> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Format Audio HTML
Ada tiga format audio yang didukung: MP3, WAV, dan OGG. Dukungan browser untuk format yang berbeda adalah:
Browser | MP3 | WAV | OGG |
---|---|---|---|
Edge/IE | YES | YES* | YES* |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | YES | NO |
Opera | YES | YES | YES |
*Dari Tepi 79
Audio HTML - Jenis Media
File Format | Media Type |
---|---|
MP3 | audio/mpeg |
OGG | audio/ogg |
WAV | audio/wav |
Audio HTML - Metode, Properti, dan Acara
DOM HTML mendefinisikan metode, properti, dan kejadian untuk <audio>
elemen.
Ini memungkinkan Anda memuat, memutar, dan menjeda audio, serta mengatur durasi dan volume.
Ada juga acara DOM yang dapat memberi tahu Anda saat audio mulai diputar, dijeda, dll.
Untuk referensi DOM lengkap, buka Referensi DOM Audio/Video HTML kami .
Tag Audio HTML
Tag | Description |
---|---|
<audio> | Defines sound content |
<source> | Defines multiple media resources for media elements, such as <video> and <audio> |