A music solution for Seamless loop playback

Scene:

In order to save page resources, it is often necessary to play a small audio loop, usually by adding the loop property on the Audio tab, but unfortunately, this property does not guarantee a seamless loop (gapless looping) playback, obviously feeling the middle of the pause.

Solution:

Use the audio tag's Web API to provide methods and properties for looping, as follows

Event name	Event function
Timeupdate	triggered when the current playback time has changed

Property name	Attribute action
CurrentTime	Used to get or control the current playback time, in units of S
Duration	Gets the total length of time, in S, of the media file, if it cannot be obtained, returns Nan

The main listener Timeupdate event, and then compare the playback time properties CurrentTime and audio Time-length properties duration, at the end of the time, the CurrentTime property is reset to 0, the code is as follows://Use the Web audio API
var audio_file = new Audio ('./videos/bg.mp3 ');
Audio_file.play ();
Audio_file.addeventlistener (' Timeupdate ', function () {
var buffer = 1.2;
if (This.currenttime > This.duration-buffer) {
This.currenttime = 0;
This.play ();
}}, False);
Usage Requirements:(1) music as far as possible is "fade" type, stress as far as possible not at the beginning or end position, otherwise, even if the music can be played back, it will not feel cohesion; (2) API interface can only be used for WebKit kernel, compare new browser

A music solution for Seamless loop playback