html5/javascript audio play multiple tracks at the same time

前端 未结 1 615
醉梦人生
醉梦人生 2021-01-19 23:01

Is it possible to play the whole audio instance at the same time?
I know, I could create every time an new instance and call .play() on every instance, but I think its d

相关标签:
1条回答
  • 2021-01-19 23:42

    Edit: MediaController and mediagroup turned out to be vaporware. You will want to stick with the "dirty" way to do it, at least for now, as there is no official syncing solution.

    The proper way to play multiple audio or video objects synchronously is to use the mediagroup attribute and the corresponding MediaController object. See the article "HTML5 multi-track audio or video":

    [A]n attribute called @mediagroup can be added in markup to slave multiple media elements together. This is administrated in the JavaScript API through a MediaController object, which provides events and attributes for the combined multi-track object.

    Set both audio files to a single mediagroup. When a media element is assigned to a mediagroup, a MediaController is created for that group. Use the play() method on that controller and all media elements in the group will play synchronously.

    Programmatically, you can assign a mediagroup like so, and then from that point trigger play() on the MediaController from any one of the slave media elements, like so:

    sound1 = new Audio('sound1.mp3');
    sound2 = new Audio('sound2.mp3');
    sound1.mediaGroup = 'soundGroup';
    sound2.mediaGroup = 'soundGroup';
    sound1.controller.play();
    

    (Sources: w3school.com's HTML Audio/Video DOM mediaGroup Property page, controller Property page, play() Method page, and the standard)

    NOTE: I haven't tested the above code; please, if you can confirm that this code is not standard-compliant and does not function as expected, let us know. Be aware that you are looking at a very new aspect of the HTML5 standard, and this being the case, do not expect broad browser compatibility. (as of January 2014)

    0 讨论(0)
提交回复
热议问题