REPRODUCTOR AUDIO

 

 

 

  Estamos en Whatsapp

Grupo:APORTES DE MUSICA

Buenos Aires - Argentina.

 

CODIGOS DE REPRODUCTORES DE AUDIO

Un sencillo reproductor de música para una página web, solo necesitamos insertar un elemento AUDIO, con algunos atributos o propiedades.

<audio src="../music/colocar el link del tema aqui.mp3" 

controls="controls" type="audio/mpeg" preload="preload">
</audio>

También es posible crear una lista de reproducción con más elementos.
El código que se puede usar es el siguiente.

<script>
function cambiarTrack(track) {
   var path =  track.getAttribute("path")
   viejo_audio = document.getElementById("reproductor")
   audio_padre = viejo_audio.parentNode
   audio_padre.removeChild(viejo_audio)
   nuevo_audio = document.createElement("audio")
   nuevo_audio.setAttribute("id","reproductor")
   nuevo_audio.setAttribute("controls", "controls")
  // nuevo_audio.setAttribute("autoplay", "autoplay")
   source = document.createElement("source")
   source.setAttribute("src", path)
   source.setAttribute("type", "audio/mpeg")
   source.setAttribute("id", "reproductorSource")
   nuevo_audio.appendChild(source)
   audio_padre.appendChild(nuevo_audio)}
function cargarReproductor() {
         var select = document.getElementById("selectTrack")
         var path = select.options[0].getAttribute("path")
   nuevo_audio = document.createElement("audio")
   nuevo_audio.setAttribute("id","reproductor")
   nuevo_audio.setAttribute("controls", "controls")       
   source = document.createElement("source")
   source.setAttribute("src", path)
   source.setAttribute("type", "audio/mpeg")
   source.setAttribute("id", "reproductorSource")
   nuevo_audio.appendChild(source)
   padre = document.getElementById("reproductorBox")
   padre.appendChild(nuevo_audio)
}
</script>
<div id="reproductorBox"></div>
<select id = "selectTrack" multiple onchange="cambiarTrack

(this.options[this.selectedIndex]);">
<option path="../music/take-on-me.mp3">Ah Ah - Take on me</option>
<option path="../music/dust-in-the-wind.mp3">Kansas - 

Dust in the wind</option>
<option path="../music/how-deep-is-your-love.mp3">Bee Geees - 

How deep is your love</option>
</select>
<script>cargarReproductor();</script>

}

Otra manera más sencilla de implementar audio dentro de una página web es utilizando HTML5  empleando la nueva etiqueta audio. Coloque en su documento HTML5 el siguiente código:

 

<audio controls>
<source src="URL del archivo mp3" type="audio/mpeg">
<source src="URL del archivo ogg" type="audio/ogg">
¡Hola usuario de Internet Explorer!, si tuvieras un navegador moderno estarías escuchando una hermosísima canción en lugar de estar leyendo esto :(
</audio>

El texto en negrita son las direcciones de la música, es conveniente ponerlo en dos formatos (mp3 y ogg) que son soportados por la mayoría de los navegadores y por si algún navegador no lo soporta el texto subrayado es un aviso para el usuario, puede cambiarlo por el que desee.