CODEWITHSUNDEEP
javascripthtmlhtml5-audio
Polymorphism
Polymorphism

Reputation: 385

Play multiple sound at the same time

Using HTML 5, I want to play multiple sounds simultaneously. how can I do it?

Here's what I currently have:

<audio controls="controls">
    <source src="audio/(TESBIHAT).mp3" type="audio/mpeg" />
    <source src="audio/Dombra.mp3" type="audio/mpeg" />

    <embed height="50px" width="100px" src="audio/(TESBIHAT).mp3" />
    <embed height="50px" width="100px" src="audio/Dombra.mp3" />
</audio>

Upvotes: 25

Views: 30669

Answers (1)

Lasse Christiansen
Lasse Christiansen

Reputation: 10325

With JavaScript and the HTML5 Audio API you could do something like this:

var snd1  = new Audio();
var src1  = document.createElement("source");
src1.type = "audio/mpeg";
src1.src  = "audio/Dombra.mp3";
snd1.appendChild(src1);

var snd2  = new Audio();
var src2  = document.createElement("source");
src2.type = "audio/mpeg";
src2.src  = "audio/(TESBIHAT).mp3";
snd2.appendChild(src2);

snd1.play(); snd2.play(); // Now both will play at the same time

I have tested this in Chrome v. 20, and it seems to work :)

The <source> tag is used to specify different formats of the same file - such that the browser can choose another format as fallback in case the first one is not supported. That is why your own suggested solution does not work.

Upvotes: 29

Related Questions