Foros del Web - Ver Mensaje Individual

Tzar · #4 (**permalink**) 20/01/2013, 20:05

El audio html5 es fácil de usar simplemente usa esto.

Código HTML:

Ver original<audio controls>
  <source src="cancion.ogg" type="audio/ogg">
  <source src="cancion.mp3" type="audio/mpeg">
Tu navegador no soporta el audio HTML5
</audio>

Puedes usar cualquiera de las dos maneras de source y puedes colocar las dos en el mismo código si te apetece. Es importante que tengas bien en cuenta el tipo de archivo.

EDIT #1 Me puse a pensar un poco y creo que lo logré! Espero que te sirva:

El index HTML sería algo así:

Código HTML:

Ver original<!DOCTIPE html>
<html lang="es">
<head>
<script language="javascript" type="text/javascript" src="funcionesReproductor.js">
</script>
</head>
<body>
   <div id="reproductorBox">
   </div>
   <select  id = "selectTrack" multiple onchange="cambiarTrack(this.options[this.selectedIndex]);">
      <option path="E:\Musica\El cuarteto de Nos\Invierno del 92 - El Cuarteto de Nos.mp3">Invierno del 92</option>
      <option path="E:\Musica\El cuarteto de Nos\El día que Artigas se emborrachó.mp3">El dia que artigas se emborachó</option>
      <option path="E:\Musica\El cuarteto de Nos\El Cuarteto De Nos - Nada Es Gratis En La Vida.mp3">Nada es gratis en la vida</option>
      <option path="E:\Musica\El cuarteto de Nos\el cuarteto de nos - miguel gritar(7).mp3">Miguel Gritar</option>
   </select>
   <script>cargarReproductor();</script>
</body>
</html>

Y ahora las funciones de java script:

funcionesReproductor.js

Código Javascript:

Ver originalfunction 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)
 
}