Audio con HTML5
Sumario
HTML5 audio
O HTML 5 proporciona un estándar que nos permite reproducir audio nunha páxina web.
Ata agora non había un estándar para amosar audio nunha páxina web. Hoxe en día a maior parte dos vídeos son amosados empregando plugins (como Flash), porén non todos os navegadores teñen os memos plugins.
HTML 5 especifica a forma de incluír audio na páxina web, coa etiqueta audio.
Formatos de audio
Actualmente, a etiqueta audio soporta tres formatos de audio:
- Ogg Vorbis
- MP3
- WAV
Como funciona?
Para reproducir audio en HTML5 o único que necesitamos é:
<audio src="song.ogg" controls="controls">
</audio>
O atributo controls é para engadir os botóns de play, pause en volume.
Entre as etiquetas de <audio> e </audio> inseriremos a mensaxe para aqueles navegadores que non soporten o elemento video de HTML5.
Exemplos
Exemplo 1: Este exemplo funcionará correctamente en Safari, Firefox, Chrome e Opera.
<audio src="song.ogg" controls="controls">
O seu navegador non soporta audio en HTML 5.
</audio>
Exemplo 2:
O elemento audio soporta múltiples elementos orixe. O navegador empregará o primeiro deles que recoñeza da lista e comezará a reproducilo.
<audio controls="controls">
<source src="song.ogg" type="audio/ogg" />
<source src="song.mp3" type="audio/mpeg" />
O seu navegador non soporta audio en HTML 5.
</audio>
Atributos da etiqueta AUDIO:
Atributo | Valor | Descrición |
---|---|---|
<autoplay> | autoplay | Especifica que o audio comezará automaticamente tan pronto estea dispoñible. |
<controls> | controls | Especifica que se amosarán os controis do audio (play, pause, stop..). |
<loop> | loop | Especifica que o audio estará sempre reproducíndose. Cando remate volverá a comezar automaticamente. |
<preload> | preload | Especifica que o audio comezará a precargarse cando se cargue a páxina web. Si a opción autoplay está presente esta opción será ignorada. |
<src> | url | Especifica a URL do audio a reproducir. |