Siirry sivun sisältöön Avut CSS HTML JavaScript Kotisivu

Ääni-objektien upotus Web-sivuille

Johdanto

HTML5-suositus toi mukanaan uuden, yksinkertaisen ja kevyen tavan upottaa sivuille äänidataa, kuten musiikkia. Enää ei ole tarvetta ongelmallisille selainlaajennuksille, kamalille skriptikirjastoille, eikä hankalalle ja huonosti tuetulle OBJECT-elementille. Nykyisin (2016) äänet saadaan sivuille mutkattomasti ja kattavasti, vain yhdellä, siihen tarkoitukseen suunnitellulla audio-elementillä.

audio-elementti

Selaimet esittävät elementtimme käyttäen natiiveja toimintoja, sekä (valinnaisia näkyviä) ohjaimia, jotka eri selaimissa poikkeavat hieman toisistaan ja joita ei voi käsitellä tyyleillä. Yksinkertaisimmillaan tarvitsemme vain kaksi attribuuttia:

Edellinen näyttää koodina seuraavalta:

<audio
  controls
  src="audio/Anikdote - Life Is Over.mp3">
<p>Lataa <a href="audio/Anikdote - Life Is Over.mp3">esimerkkikappale</a>.</p>
</audio>

Elementin sisältö on varattu vanhemmille, elementtiämme tukemattomille selaimille.

Koodin tulos

Selaimen tulisi esittää, joko:

Esimerkkikoodimme tulostuu seuraavasti:

XXX

Dokumentin julkaisupäivämäärä: 2016-02-02.
Osmo Saarikumpu