Audio-tagi
audio-tagi hallinnoi
äänitiedoston toistoa HTML-sivulla. Kun
se lisätään, sivulle ilmestyy toistin,
jossa on "Takaisin", "Eteenpäin",
"Pysäytä" ja muut painikkeet
(niiden ulkoasu ja määrä riippuu selaimesta).
Tiedostopolku määritetään
src-attribuutilla tai upotetulla source-tagilla.
source-tagi tarvitaan
äänitiedostojen polkujen määrittämiseen eri formaateissa
(koska selaimet tukevat eri ääniformaattia,
esimerkiksi mp3 tai wav).
Jos sinulla on tallenne yhdessä formaateista,
se on muutettava muihin formaatteihin.
audio-tagin sisälle voidaan kirjoittaa tekstiä,
joka näytetään selaimissa, jotka
eivät tue ääntä HTML:ssä (tämä tehdään
ilmoittamaan käyttäjille tästä).
Jos haluat nähdä toistimen äänen toiston hallitsemiseksi
- tulee lisätä controls-attribuutti.
Ilman sitä et näe mitään - eikä ääntäkään
tuolloin kuulu. Jotta ääni kuuluisi ilman
toistinta - lisää autoplay-attribuutti.
Attribuutit
| Attribuutti | Kuvaus |
|---|---|
src |
Määrittää polun äänitiedostoon.
Mutta on parempi käyttää tähän source-tagia
(silloin voidaan määrittää ääni eri formaateissa).
|
preload |
Käytetään äänitiedoston lataamiseen samanaikaisesti verkkosivun latautumisen kanssa.
Hyväksytyt arvot: none (ei lataa tiedostoa, oletus),
metadata (lataa vain metadata: keston jne.),
auto (lataa koko äänitiedoston HTML-sivun latauksen yhteydessä).
|
autoplay |
Ääni alkaa soida heti sivun latautumisen jälkeen,
jolloin preload-attribuuttia ei huomioida.
Attribuutti ilman arvoa. |
controls |
Lisää ohjauspaneelin äänitiedostolle.
jolloin preload-attribuuttia ei huomioida.
Attribuutti ilman arvoa. |
loop |
Toistaa äänitiedoston "silmukassa": päättyessään se alkaa soida alusta.
jolloin preload-attribuuttia ei huomioida.
Attribuutti ilman arvoa. Oletusarvoisesti (jos attribuuttia ei ole) tallenne toistetaan vain 1 kerran.
|
muted |
Poistaa äänen äänitiedostosta.
Attribuutti ilman arvoa. Oletusarvoisesti (jos attribuuttia ei ole) tallenteen ääni on päällä. |
Esimerkki . Toistin verkkosivulla
Lisätään sivulle toistin äänitiedostolla.
Niille selaimille, jotka eivät tue
audio-tagia, on jätetty erityinen viesti
tästä:
<audio src="track.mp3" controls>
Selaimesi ei tue audio-toimintoa HTML5:ssä.
</audio>
Esimerkki . Toistin verkkosivulla source-tagilla
Ja nyt käytetään src-attribuutin sijasta
audio-tagille lisättyä source-tagia:
<audio controls>
<source src="track.mp3">
Selaimesi ei tue audio-toimintoa HTML5:ssä.
</audio>
