Varios reproductores de Audio en un mismo documento

[Kuouz]

Iniciado por Kuouz

Hola a todos. Ando dando mis primeros pasos en esto del desarrollo web haciéndole una página personal a un colega músico. Tenemos un home con enlaces a tres secciones, y la idea era que junto a estos enlaces apareciese un botón de play para escuchar una muestra de cada sección. Para ello googlee hasta encontrar un ejemplo sencillo en el que con HTML5 y algo de Javascript hacían un reproductor sencillo que constaba sólo de un botón de play que al clicar reproducía una pista de audio, cambiándose a su vez el icono de play por otro de pause. Sin más.

El problema es cuando intento modificar el archivo .js para los otros plays, que no tengo ni idea de que instancias debo cambiar para que me funcione y me entran en conflicto. Os dejo el código html y javascript que funciona para un solo play, a ver si alguien me podría decir qué hacer para hacer funcionar varios plays en un mismo documento. Gracias por adelantado.

html:

Código:

<li class="posplay1">
                  <a href="#" id="play" class="audio_control">
                  <img src="imagenes/web/play_index.png" width="36" height= "36" 
                   alt="play" border="0"></a>
                  <a href="#" id="pause" class="audio_control" style="display:none">      
                  <img src="imagenes/iconos/pause_plat.png" width= "46"
                  height="46" alt="pause" border="0"></a>
                  <audio id="player" preload="auto" >
	          <source src="audio/jorge_salan_la_lluvia_quedo_atras.mp3" />
	          Si tuviésemos la fuente en ogg, la pondríamos aquí 
                  </audio>  
            </li>

Js:

Código:

var player = false;
var canvas = false;
var context = false;
var paused = false;







var pause = function(){
	//Pausamos la reproducción
	player.pause();
	paused = true;

	//Escondemos el pause y mostramos el play
	$('#pause').hide(); $('#play').show();
}

var play = function(){
	//Iniciamos la reproducción
	player.play();
	paused = false;

	//Escondemos el play y mostramos el pause
	$('#play').hide(); $('#pause').show();
}


//
var init = function(){
	//Inicializamos el player
	player = document.getElementById('player');

	//Asociamos eventos a los botones de play y pause
	$('#play').click(play);
	$('#pause').click(pause);
	$('#volUp').click(function() { addVol(0.1) } );
	$('#volDown').click(function(){ addVol(-0.1) });

	

	
};

$(document).ready(function(){
	$('.audio_control').click(function(event){
		event.preventDefault(); //Evitamos que se mueva la ventana al hacer clic en los enlaces
	});

	$('#player').bind('loadedmetadata', init); //Lanzamos la función init cuando se hayan cargado los metadatos

});
// JavaScript Document

[Kuouz]

Nadie me puede echar una mano??